確認ダイアログでOKの代わりにはい/いいえを表示

Question

単純なjavascriptの確認ダイアログで、OKの代わりにyesを表示するにはどうすればいいですか？私はjavascriptの知識がないので、これを行う最も簡単な方法は何ですか？私はいくつかのコードを試しましたが、結果は得られませんでした。

function doConfirm("Are you sure?", yesFn, noFn) { 
 
    var confirmBox = $("#confirmBox"); 
 
    confirmBox.find(".message").text(msg); 
 
    confirmBox.find(".yes,.no").unbind().click(function() { 
 
     confirmBox.hide(); 
 
     confirmBox.prev().remove(); 
 
    }); 
 
    confirmBox.find(".yes").click(yesFn); 
 
    confirmBox.find(".no").click(noFn); 
 
    confirmBox.show(); 
 
    var overlay = $("<div>").css({ 
 
     position: "fixed", 
 
     top: 0, 
 
     left: 0, 
 
     right: 0, 
 
     bottom: 0, 
 
     backgroundColor: "rgba(255,255,255,0.5)" 
 
    }).insertBefore(confirmBox); 
 
} 
 

 
$(function() { 
 
    $("form").submit(function (e) { 
 
     e.preventDefault(); 
 
     var form = this; 
 
     doConfirm("Are you sure?", function yes() { 
 
      form.submit(); 
 
     }, function no() { 
 
      return false; 
 
     }); 
 
    }); 
 
});

body { font-family: sans-serif; } 
 
#confirmBox 
 
{ 
 
    display: none; 
 
    background-color: #eee; 
 
    border-radius: 5px; 
 
    border: 1px solid #aaa; 
 
    position: fixed; 
 
    width: 300px; 
 
    left: 50%; 
 
    margin-left: -150px; 
 
    padding: 6px 8px 8px; 
 
    box-sizing: border-box; 
 
    text-align: center; 
 
} 
 
#confirmBox .button { 
 
    background-color: #ccc; 
 
    display: inline-block; 
 
    border-radius: 3px; 
 
    border: 1px solid #aaa; 
 
    padding: 2px; 
 
    text-align: center; 
 
    width: 80px; 
 
    cursor: pointer; 
 
} 
 
#confirmBox .button:hover 
 
{ 
 
    background-color: #ddd; 
 
} 
 
#confirmBox .message 
 
{ 
 
    text-align: left; 
 
    margin-bottom: 8px; 
 
}

<form method="post" action=""> 
 
    <input type="hidden" name="html" value="&lt;p&gt;Your data has been deleted&lt/p&gt;" /> 
 
    <input type="submit" value="Delete My Data" /> 
 
</form> 
 
<div id="confirmBox"> 
 
    <div class="message"></div> 
 
    <span class="button yes">Yes</span> 
 
    <span class="button no">No</span> 
 
</div>

はまた、このhttp://jsfiddle.net/Xtreu/269/

http://jsfiddle.net/Xtreu/270/を試みたが、まだ私はそれを得ることはありません。助けが必要！

あなたは次のようにスクリプトタグでAJAX呼び出しを使用することができます

Answer 1

：

  $('#divDeleteDialog').dialog({ 
       title: "Delete User", 
       resizable: false, 
       draggable: false, 
       width: "400px", 
       modal: true, // only this dialog is active 
       buttons: { 
        "Yes": function() { 
         $('#txtDID').html(''); 
         $.ajax({ 
          url: "WebService.asmx/DeleteUser", 
          type: "post", 
          contentType: "application/json; charset=utf-8", 
          data: 
           JSON.stringify(
           { "id": $('#txtDID').val() } 

           ), // parameters 
          beforeSend: function() { 
           $('#loader').html('<img src="Images/loading.gif" />'); 
          }, 

          success: function (result) { 
           $('#loader').html(''); 

          }, 
          error: function() { 
           alert('error Deleteing user'); 
          } 
         }); 
         // modify existing data 


         $('#txtDID').val(''); 
         $('#txtDFName').val(''); 
         $('#txtDLName').val(''); 
         $('#txtDEmail').val(''); 

         $('#divDeleteDialog').dialog('close'); 
         tr.fadeOut(2000); 
        }, 
        "No": function() { 
         $('#divDeleteDialog').dialog('close'); 
        } 
       } 
      }); 

データと2つのボタン（はい、いいえ）を提示するダイアログボックスを：#confirmBoxのHTMLで

<div id="divDeleteDialog" style="display:none"> 
     <h4> you are going to permenantly delete this user ? </h4> 
     <div class="form-group-sm"> 
      <label for="txtDID">ID</label> 
      <input type="text" id="txtDID" class="form-control" disabled/> 
     </div> 
     <div class="form-group-sm"> 
      <label for="txtDFName">First Name</label> 
      <input type="text" id="txtDFName" class="form-control" disabled/> 
     </div> 
     <div class="form-group-sm"> 
      <label for="txtDLName">Last Name</label> 
      <input type="text" id="txtDLName" class="form-control" disabled/> 
     </div> 
     <div class="form-group-sm"> 
      <label for="txtDEmail">Email 
      </label> 
      <input type="text" id="txtDEmail" class="form-control" disabled/> 
     </div> 
       <h4> are you sure? </h4> 
    </div> 

Answer 2

あなたは

<a class='button' href="#" title="some text for tooltip" onclick="doYesAction)"> Yes </a> 
 
<a class='button' href="#" title="some text for tooltip" onclick="doNoAction)"> No </a>

：<このような>であなたのボタンを定義する必要があります