2

この質問の回答を読んだ後

ユーザーのクリックイベントに依存する preventDefault / stopPropagation を構築する方法を知りたいと思っていました。たとえば、次のようになります。

<html>
   <a data-handler="add_to_cart" data-item_id="5">Click</a>
</html>

現在、要素をクリックすると、(ajax によって) バックエンドが呼び出され、アイテム 5 がユーザーのカートに追加されます。しかし、最初にダイアログを挿入したい場合はどうすればよいですか (javascript のみ)

var template = '' +
    '<div class="dialog">' +
        '<p>Really add this item?</p>' +
        '<button>Yes</button>' +
        '<button>No</button>' +
    '</div>'

$(a).click(function(){
    # open the dialog template
    # if the correct button is clicked continue the default event
});

confirmまたはを使用したくありませんprompt。基本的に、独自の html ダイアログでそれらの機能を実装する方法を探しています。

4

2 に答える 2

0

これを行うには、いくつかのオプションがあります。私がお勧めする 2 つの方法は、プロンプト メソッドをオーバーライドするか (外観のオーバーライドと変更についてはこちらとこちらをご覧ください)、独自のダイアログを作成してそのボタンを監視することです。

オーバーライド:

function prompt() { 
    //Insert your HTML, show the dialog
}

別のクリックを監視します。

$('#someOtherButton').click(function(){
    //Do what you want
});

単純にオーバーライドすることをお勧めしますprompt()。

于 2013-04-29T13:38:06.673 に答える
0

click()伝播を防ぎ、ダイアログからメソッドを再呼び出しして、伝播を要求することができます。

var template = '' +
    '<div class="dialog">' +
        '<p>Really add this item?</p>' +
        '<button class=correctbutton>Yes</button>' +
        '<button>No</button>' +
    '</div>'

$(a).click(function(){
    if(window.correctButtonClicked){
     return true;//continue propagation
    }
    window.clickedA=a // store current clicked object
    openDialog() 
    return false; //stop propagation
});

function openDialog(){
 //Make a dialog from the template
 $('.correctbutton').click(function(){
      window.correctButtonClicked=true;
      $(window.clickedA).click(); 
 });

}
于 2013-04-29T13:40:29.813 に答える