ボタンがクリックされていないときにツールチップを表示

Question

フォームを送信しているときに特定のボタンをクリックしなかったときにツールチップを表示したい。フォームが送信されないようにして、「最初にボタンをクリックする」と言うヒントを表示したい。前もって感謝します。

<form id="signUpForm"> 
    <button type="button" id="agree" class="btn btn-default" data-color="info" tabindex="7">I Agree</button> 
    <input type="hidden" id="hidden" value="0"> 
    <input type="submit" id="btn-submit" value="submit"> 
</form> 

<script> 
    $('#signUpForm').submit(function(e) { 
     if ($('#hidden').val() == '0') { 
      e.preventDefault(); 
      //show the tooltip that "you first click the agree button" and fadeOut(1000) 
     } 
    }); 
</script> 

Answer 1

ではなく、提出のボタンとして、ボタンの種類を作る、これを試してください：表示ツールチップのためにあなたにそれが意志役立つスクリプト以下

<form id="signUpForm" > 
<button type="button" id="agree" class="btn btn-default" data-color="info" tabindex="7" >I Agree</button> 
<input type="hidden" id="hidden" value="0"> 
<input type="button" id="btn-submit" value="submit"> 
</form> 

<script> 
$('#btn-submit').click(function(e){ 
    if($('#hidden').val()=='0'){ 

    } 
    else { 
     $('#signUpForm').submit(); 
    } 
}); 
</script> 

Answer 2

チェックを。

<script> 
    $(".tooltip").hide(); 
    $('#signUpForm').submit(function (e) { 
     if ($('#hidden').val() == '0') { 
      e.preventDefault(); 
      //show the tooltip that "you first click the agree button" and fadeOut(1000) 
      $("#signUpForm").find(".tooltip").stop().fadeIn(); 
      setTimeout(function() { 
       $("#signUpForm").find(".tooltip").stop().fadeOut(); 
      }, 1000); 
     } 
    }); 
</script> 

HTMLパート

<form id="signUpForm"> 
    <button type="button" id="agree" class="btn btn-default" data-color="info" tabindex="7">I Agree</button> 
    <input type="hidden" id="hidden" value="0"> 
    <input type="submit" id="btn-submit" value="submit"> 
    <div class="tooltip"> 
     you first click the agree button 
    </div> 
</form>