コンテンツプレースホルダでJqueryの確認ダイアログが機能しない

Question

JQUERY Confirmダイアログを使用して、ユーザーに[OK]または[キャンセル]を押すように要求しています。私はmasterpageの中にあるページを入れるまでうまくいきます。確認アラートは1ミリ秒間表示され、消えます。

window.onload = function() { 
 
    $("#ehi").click(function() { 
 
    $.confirm({ 
 
     title: 'Are you sure you want to approve this application? Note: This action cannot be reverted. An automatic email will be sent to the student to notify him/her of the decision.', 
 
     content: '', 
 
     buttons: { 
 
     confirm: function() { 
 
      $.confirm({ 
 
      title: 'Confirmed confirmation!', 
 
      content: 'Simple confirmation!', 
 
      buttons: { 
 
       confirm: function() { 
 

 
       }, 
 
       cancel: function() { 
 

 
       }, 
 

 
      } 
 
      }); 
 
     }, 
 
     cancel: function() { 
 

 
     }, 
 
     somethingElse: { 
 
      text: 'Something else', 
 
      btnClass: 'btn-blue', 
 
      keys: ['enter', 'shift'], 
 
      action: function() { 
 
      $.alert('Something else?'); 
 
      } 
 
     } 
 
     } 
 
    }); 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.2.3/jquery-confirm.min.css"> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.2.3/jquery-confirm.min.js"></script> 
 

 

 
<button id="ehi" class="btn btn-info">confirm</button>

これは、通常のWebフォームまたはページで正常に動作しますのでご注意ください。したがって、インポートされたリンクはすべて正常です。しかし、私がマスターページに含まれているページの中に置くたびに、それはしません。

Answer 1

jquery.min.jsの後にjquery-confirm.min.jsファイルを含める必要があります。これらのスクリプトはすべて、コードを実行する前にロードする必要があります。

window.onload = function() { 
 
    $("#ehi").click(function() { 
 
    $.confirm({ 
 
     title: 'Are you sure you want to approve this application? Note: This action cannot be reverted. An automatic email will be sent to the student to notify him/her of the decision.', 
 
     content: '', 
 
     buttons: { 
 
     confirm: function() { 
 
      $.confirm({ 
 
      title: 'Confirmed confirmation!', 
 
      content: 'Simple confirmation!', 
 
      buttons: { 
 
       confirm: function() { 
 

 
       }, 
 
       cancel: function() { 
 

 
       }, 
 

 
      } 
 
      }); 
 
     }, 
 
     cancel: function() { 
 

 
     }, 
 
     somethingElse: { 
 
      text: 'Something else', 
 
      btnClass: 'btn-blue', 
 
      keys: ['enter', 'shift'], 
 
      action: function() { 
 
      $.alert('Something else?'); 
 
      } 
 
     } 
 
     } 
 
    }); 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.2.3/jquery-confirm.min.js"></script> 
 
<button id="ehi" class="btn btn-info">confirm</button>

Answer 2

<button id="ehi" type="button" class="btn btn-info">confirm</button> 

OR

$("#ContentPlaceHolder1_ehi").click(); 

この方法を試してみてください。