Question

我正在使用一个使用jquery创建手风琴的插件。但是，我的jquery函数在操作dom之前运行，并且我已经创建了我在我的函数中定位的div id。这是我的功能。

jQuery('#_Offer_Something').click(function(){

      if( !confirm('Delete?') ) { //show confirm dialog
            return false; //do nothing if cancel is clicked (prevent the browser from following clicked link)
      }else{
           window.location.replace("http://stackoverflow.com"); 
    }
});

所以基本上这不起作用，因为div还不存在。

Answer 1

修改

在您的具体情况下，您可以使用：.on()

(function($){ // remap the '$' symbol to jQuery $(document).on('click', '#_Offer_Something',function(){ // ^^^^ or 'body' or a parent element if( !confirm('Delete?') ) { //show confirm dialog return false; //do nothing if cancel is clicked (prevent the browser from following clicked link) }else{ window.location.replace("http://stackoverflow.com"); } }); })(jQuery);

以上内容将作为现已弃用的jQuery .live()方法确保将jQuery <script>标记放在</body>标记之前。

Answer 2

如果您的DOM对象是在页面加载后的某个时候动态创建的，那么您将需要使用委托事件处理，以便即使您的事件处理程序安装在相关对象之前，也会拾取它的事件。您可以使用动态形式.on()：

使用jQuery 1.7+

jQuery(document).on('click', '#_Offer_Something', function(){

      if( !confirm('Delete?') ) { //show confirm dialog
            return false; //do nothing if cancel is clicked (prevent the browser from following clicked link)
      }else{
           window.location.replace("http://stackoverflow.com"); 
    }
});

从技术上讲，这种方式的工作方式是所有点击事件都会在祖先链上冒泡（除非一路上的某个对象停止了冒泡过程）。在这种情况下，我们在document对象上安装了一个单击处理程序，它会监视源自与#_Offer_Something选择器匹配的对象的单击事件。

为了获得最佳性能，您实际上不会将此事件处理程序绑定到document对象。相反，您将选择在安装事件处理程序时确实存在的静态父对象（#_Offer_Something的某个父对象）。我之所以选择document对象只是因为你没有透露其余的HTML，所以我不知道会有更好的选择。

Answer 3

使用jQuery on绑定或仅在插入元素后绑定它。有关示例，请参阅http://api.jquery.com/on/。快速举例：

$(document).on('click', '#_Offer_Something', function(){});

Answer 4

$(document).ready(function(){
  ... code here ...
});

或

$(function(){
  ... Code here ...
});

在将div添加到dom之后如何运行jquery函数？

4 个答案: