带有 Jeditable 的 Jquery ui答案

【问题标题】：Jquery ui with Jeditable带有 Jeditable 的 Jquery ui
【发布时间】：2011-12-12 23:48:25
【问题描述】：

我正在尝试这段代码：

<script type="text/javascript">
$(document).ready(function() {
    $('.edit').editable('http://www.example.com/save.php', {
        indicator : 'Saving...',
        tooltip   : 'Click to edit...',
        submit    : 'OK',
        cancel : 'Cancel',
    });

    $('#cv_cd > input').autocomplete({
        source: 'location.php',
        minLength: 2

    });
});
</script>


<div class="edit" id="cv_cd">Type</div>

此代码与<inputs /> 一起正常工作，但在 jeditable 中，当我输入内容时不会发送任何请求。

在使用 firebug 搜索代码后，jeditable 还会创建一个input 字段，但显然这样的东西不起作用$('#cv_cd > input').autocomplete({

有什么想法吗？谢谢

【问题讨论】：

标签： jquery jquery-ui autocomplete jeditable

【解决方案1】：

.autocomplete() 不是live，所以它只绑定到调用时存在的元素。

在您的情况下，您需要使用live 或者最好使用delegate 来适应input 元素在用户单击它之前不会存在的事实。知道具有自动完成功能的元素具有 ui-autocomplete-input 类，您可以执行以下操作，以替换原来的 .autocomplete()：

$("#cv_cd").delegate(".ui-autocomplete-input", "focus", function (event) {
    $(this).autocomplete({
        source: 'location.php',
        minLength: 2
    });
});

【讨论】：