如果在jsTree中,jQuery单击处理程序不起作用

时间:2011-06-01 00:31:03

标签: jquery jquery-plugins jquery-selectors

我的问题首先。 如何让jsTree中的按钮工作?它与定义的onclick一起使用。

但是现在我使用jQuery处理程序来点击按钮。工作良好。请参阅示例http://jsfiddle.net/radek/5xym7/4/

我将处理程序定义(如下所示)复制到我现有的代码中(稍微复制一下,并且不确定我需要提供哪个部分来调试问题)

$('button[type=button]').click(function(){
    var params = $(this).val();
    document.getElementById("results").innerHTML+="<BR>"+params.split('|')[0]+" - "+ params.split('|')[1]+" - "+ $(this).next().prop('checked');

});

页面如何显示

how the page look like

但它不适用于jsTree内的按钮,另一方面<div id='jstree'></div>外的按钮适用于我的处理程序。

jsTree中按钮的html

<button value="login|basic" class="run square_button button_background" type="button"> run </button>
<input name="restore" title="restore before ant run" type="checkbox">

jsTree以外按钮的html

    <button class='run square_button button_background button' id='search' type='button' value='Search'>
      Search
    </button>

1 个答案:

答案 0 :(得分:1)

在您的示例中,您绑定了来自$(document).ready()的click事件,但是在$(document).ready()函数之外初始化了jsTree对象。一旦加载了源部分,jsTree创建块就会执行,而在加载整个DOM时,$(document).ready()将在稍后执行。因此,当您尝试绑定到其click事件时,jsTree包含的按钮实际上还不存在。

解决这个问题的两种简单方法:

  • 使用jQuery的live()函数来允许绑定dinamically创建的DOM节点
  • 重新组织你的代码,所以jsTree初始化也发生在$(document).ready()中,并在创建jsTree后绑定到click事件

我把后者当作你的小提琴,现在似乎工作得很好。 http://jsfiddle.net/5xym7/6/