JQueryダイアログボタンにイベントをバインドする

Question

jQueryに問題があります。ユーザーがリンクをクリックして何かを削除し、実際に削除するかどうかを確認するダイアログボックスが表示されるようにしたい。ダイアログボックスは正常に表示されますが、ユーザーが「はい」ボタンをクリックしたときにリンクのURLを取得する方法が表示されません。私はevent.relatedTargetプロパティを使ってタグのURLを取得しようとしましたが、それはnullです。誰もこれを行う方法を知っていますか？

コード

<div id="dialog" title="Delete Run"> 
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span>Are you sure you want to delete that run?</p> 
</div> 
$(document).ready(function() { 
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 400, 
     modal: true, 
     draggable: false, 
     resizable: false, 
     buttons: { 
      "Yes": function(event) { 
       //Go to the url in $("a.delete") 
      }, 
      "No": function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $("a.delete").click(function(){ 
     var url = $(this).attr("href"); 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
}); 

Answer 1

<div id="dialog" title="Delete Run"> 
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span>Are you sure you want to delete that run?</p> 
</div> 
$(document).ready(function() { 
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 400, 
     modal: true, 
     draggable: false, 
     resizable: false, 
     buttons: { 
      "Yes": function(event) { 
       var url = $(this).data('url'); 
       window.location = url; 
      }, 
      "No": function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $("a.delete").click(function(){ 
     $('#dialog').data('url', $(this).attr("href")); 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
}); 

あなたのコード内のどの要素のa.deleteがないので、推測の少し？ 通常、jQueryのdata（）を使用する方がグローバル変数よりも優れています。

Answer 2

ドキュメントの先頭にurl変数を宣言すると、関数内のその変数にアクセスできます。 （ドキュメント）.ready後var url;を行うので、まず、それからの関数をクリックし、最終的にそのように、その変数にウィンドウの位置を設定し、削除からのvar宣言を削除：window.location.href = url;あなたは最終的にこのような何かを得るでしょう：

$(document).ready(function() { 
    var url; 

    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 400, 
     modal: true, 
     draggable: false, 
     resizable: false, 
     buttons: { 
      "Yes": function(event) { 
       window.location.href = url; 
      }, 
      "No": function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    $("a.delete").click(function(){ 
     url = $(this).attr("href"); 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
}); 

ここにコードで例を設定しました：http://jsfiddle.net/dGETj/