实时点击事件

时间:2011-07-28 02:14:46

标签: jquery

有人可以向我指出如何让问候课成为实时点击事件。

$('.ask').jConfirmAction( {
    question : "Are you sure you want to delete the selected row?", 
    yesAnswer : "Yes", 
    cancelAnswer : "No", 
    onYes: function(evt) { 
      contentpages(evt.target); 
    }
});

除非在此页面上:

 /*
 * jQuery Plugin : jConfirmAction
 * 
 * by Hidayat Sagita
 * http://www.webstuffshare.com
 * Licensed Under GPL version 2 license.
 *
 */
(function($){

jQuery.fn.jConfirmAction = function (options) {
    var theOptions = jQuery.extend( {
        question: "Are You Sure ?",
        yesAnswer: "Yes",
        cancelAnswer: "Cancel",
        questionClass: "question",
        yesClass: "yes",
        cancelClass: "no",
        onYes: function() {}   // for specifying a function to call when the "yes" button is clicked
    }, options );

    return this.each( function() {

        $(this).bind('click', function(e) {
            e.preventDefault();

            if($(this).next('.' + theOptions.questionClass).length <= 0) {
                $(this).after('<div class="' + theOptions.questionClass + '">'+theOptions.question+'<br/><span class="' + theOptions.yesClass + '">'+theOptions.yesAnswer+'</span><span class="' + theOptions.cancelClass + '">'+theOptions.cancelAnswer+'</span></div>');

                $( '.' + theOptions.yesClass ).bind('click', function( evt ) {
                    theOptions.onYes( evt );
                    $(this).parents( '.' + theOptions.questionClass ).fadeOut( 300, function() {
                        $(this).remove();
                    } );
                });

                $( '.' + theOptions.cancelClass ).bind('click', function(){
                    $(this).parents( '.' + theOptions.questionClass ).fadeOut( 300, function() {
                        $(this).remove();
                    } );
                });
            }

            $(this).next( '.' + theOptions.questionClass ).animate( { opacity: 1 }, 300 );
        });

    } );
}

})(jQuery);

1 个答案:

答案 0 :(得分:3)

如果您不想更改插件的代码,只需在页面中放入“.ask”元素后对其进行初始化即可。 e.g。

$("<div class='ask'>Ask me</div>").appendTo(".container").jConfirmAction({...});

如果您希望插件在不存在的元素上注册事件,则需要修改它以将选择器名称作为参数并通常注册实时事件 - 这是一种快速而肮脏的方式

/*
 * jQuery Plugin : jConfirmAction
 * 
 * by Hidayat Sagita
 * http://www.webstuffshare.com
 * Licensed Under GPL version 2 license.
 *
 */
(function($){

 $.extend({
        jConfirmAction: function (options) {
                // Some jConfirmAction options (limited to customize language) :
        // question : a text for your question.
        // yesAnswer : a text for Yes answer.
        // cancelAnswer : a text for Cancel/No answer.
        var theOptions = jQuery.extend ({
            question: "Are You Sure ?",
            yesAnswer: "Yes",
            cancelAnswer: "Cancel",
            targetSelector : ".sample_selector"
        }, options);


            $(theOptions.targetSelector).live('click', function(e) {

                e.preventDefault();
                thisHref    = $(this).attr('href');

                if($(this).next('.question').length <= 0)
                    $(this).after('<div class="question">'+theOptions.question+'<br/> <span class="yes">'+theOptions.yesAnswer+'</span><span class="cancel">'+theOptions.cancelAnswer+'</span></div>');

                $(this).next('.question').animate({opacity: 1}, 300);

                $('.yes').bind('click', function(){
                    window.location = thisHref;
                });

                $('.cancel').bind('click', function(){
                    $(this).parents('.question').fadeOut(300, function() {
                        $(this).remove();
                    });
                });

            });
        }
    });




})(jQuery);

你就像这样初始化

        $(document).ready(function() {

    //specify what selector you want - all the other options still work     
    $.jConfirmAction({targetSelector: ".sample_selector"});

//add an element
                $("<div class='sample_selector'>Ask me</div>").appendTo("#container");


        });