0

送信をクリックした後、作成中のフォームのフィールドが空のときにポップアップを追加しようとしています。送信をクリックするとポップアップが正常に機能しますが、リセットボタンをクリックするか、すべてのフィールドに入力すると、ポップアップが消えて機能しません。これは Javascript (または Jquery) と CSS を使用してのみ解決でき、HTML コードは変更できないことに注意してください。

Javascript (関連すると思われるものをここに含めました):

function showPopUp(){

  popUp = document.createElement( "div" );
  popText = document.createElement( "p" );
  popUp.id = "popUp";
  document.body.appendChild( popUp );


  popText.id = "popText";

  popText.innerHTML = "Still have fields empty";
  popText.style.marginLeft = popUp.width / 2 + "px";
  popText.style.marginTop = popUp.height / 2 + "px";
  document.body.appendChild( popText );


  return false;
}
function closePopUp() {
    popText.parentNode.removeChild(popText);
    popUp.parentNode.removeChild(popUp);
}

showPopUp(); checkContactForm( this ) 関数で実行されます。

HTML:

<form id="contact" action="" onsubmit="checkContactForm( this ); return false;" >
<p>
  <label for="name">First name:</label>
  <input name="name" id="name" onfocus="resetField( this );" />
</p>
  <label for="message">Your Message:</label>
  <textarea name="message" id="message" onfocus="resetField( this );"></textarea>
</p>
<p>
  <button type="submit">Send Message</button>
  <button type="reset">Reset Form</button>
</p>
4

2 に答える 2

0

リセットボタンをクリックしたときにポップアップを閉じる機能を呼び出すことができます。例えば：

Jqueryで！

$("button:eq(1)").click(function(){
    closePopUp();
});

または、javascript を使用して、html に onclick 関数を追加できます。

onclick=closePopup()

すべての入力フィールドをチェックするには、各関数を使用できます

$("input").each(function() {
   var element = $(this);
 if (element.val() == "") {
   isValid = false;
 } 

  });
于 2013-10-13T03:33:09.983 に答える
0

このコードは機能しないと思います。コンソールに表示されpopText is undefinedます。popUp is undefined

これを修正するには、closePopUp() を次のように変更します。

function closePopUp() {
    popText = document.getElementById('popText');
    popText.parentNode.removeChild(popText);
    popUp = document.getElementById('popUp');
    popUp.parentNode.removeChild(popUp);
}

コンソールに他の問題が表示されている場合は、それを共有してください。

jsfiddleまたはjsbinで fidde を作成できる場合はさらに良い

于 2013-10-13T04:09:32.247 に答える