jquery绑定unbind

时间:2012-10-31 15:02:35

标签: jquery

您好我有一个网站,可以在conatiner中动态加载页面。我有一个这样的导航菜单:

<div class="menu">
    <p align="left" id="home" class="titolo_menu">home</p>
    <p align="left" id="azienda" class="titolo_menu azienda"><br>azienda</p>
    <p align="left" id="staff" class="titolo_sotto_menu azienda">staff</p>
    <p align="left" id="risorseumane" class="titolo_sotto_menu azienda">risorse umane</p>
</div>

在我的jQuery中,我添加了这一行:

$(document).ready(function(){
    $('.titolo_menu').bind('click',function(){
            $('.titolo_menu').unbind('click');
             //more code...
     });
  });

我想当用户点击带有“titolo_menu”类的p时禁用事件点击但不起作用,我可以点击越来越多的时间。我该如何解决?

4 个答案:

答案 0 :(得分:2)

虽然我无法弄清楚你的应用程序中你真正想要的是什么,但考虑将data-*属性用于DOM本身内的相同状态,例如:

$(document).ready(function(){
    $('.titolo_menu').on('click',function(){

        // let's create a reference for current element
        $p = $(this);

        // if clicked element had data-disabled attribute set, return
        if($p.data('disabled'))
            return;

        // disable element;
        $p.data('disabled', true);

        // do your stuff here, e.g.
        $.get('dapage.html', function(data){

            // do your stuff on data retrieving
            $(something).html(data);

            // re-enable element
            $p.data('disabled', false);

        });

   });
});

通过这种方式,您可以控制事件,而不会破坏解除绑定。

答案 1 :(得分:0)

你可以尝试这个......

$(document).ready(function(){
var return_flag = true;
    $('.titolo_menu').bind('click',function(){
        if(return_flag){
             //more code...
        }
    return_flag = false;
     });
  });

答案 2 :(得分:0)

只需更改班级名称

即可
$('.titolo_menu').bind('click',function(){
           $(this).removeClass('.titolo_menu');
             //more code...
     });

或者如果要禁用所有元素:

$('.titolo_menu').bind('click',function(){
            $('.titolo_menu').removeClass('.titolo_menu');
             //more code...
     });

如果使用'bind'

//编辑 对不起,它不起作用。 只需使用live:

$('.titolo_menu').live('click', function(){
  $('.titolo_menu').removeClass('.titolo_menu');
}); 

但是,如果您只想阻止多次点击,只需使用

.attr('disabled', 'disabled');

答案 3 :(得分:0)

首先,我建议您在创建菜单时使用未排序的列表,并使用<a>标记链接页面。

示例:

<ul id="menu">
    <li id="home" class="titolo_menu"><a href="#home">home</a></li>
    <li id="azienda" class="titolo_menu azienda"><a href="#azienda">azienda</a></li>
    <li id="staff" class="titolo_sotto_menu azienda"><a href="#staff">staff</a></li>
    <li id="risorseumane" class="titolo_sotto_menu azienda"><a href="#risorseumane">risorse umane</a></li>
</ul>

在jQuery中你可以做这样的事情:

$(function() {

    $("#menu a").click(function(e) {
        var clickedElement = $(this);
        var clickedElementText = clickedElement.text();

        // Check if current link is not yet active
        if (!$(clickedElement).hasClass("active")) {

            if ($(".active").length > 0) {
                // Deactivate current active link
                var active = $(".active ");
                var activeText = $(active).text();

                $(".active").replaceWith("<a href = '#" + active.parent().attr("id") + "' > " + activeText + " </a>");
            }
            // Change the clicked link to be activated
            $(clickedElement).replaceWith("<span class='active'>" + clickedElementText + "</span>");

            // Load your page or whatever here :)

            // Prevent normal link behavior
            e.preventDefault();
        }
    });
});