Jeditable - 单击Y激活X的编辑

yoa*_*avf 15 jquery jeditable

我正在尝试使用Jeditable作为内联编辑解决方案.

默认行为(单击要编辑它的元素)工作得很好,但我想通过单击另一个元素来激活元素.

例如,单击a.activateEdit将激活下一个div.edit(显然应该使用jQuery选择器完成).

我已经研究了Jeditable docs,但找不到合适的语法

仅供参考,默认的Jeditable语法类似于:

 $(document).ready(function() {
     $('.edit').editable('http://www.example.com/save.php');
 });
Run Code Online (Sandbox Code Playgroud)

*编辑:找到更好的解决方案*

Mik*_*ola 24

上面的代码也不太正确.它会触发所有Jeditable实例上的click事件.

有很多方法可以做到这一点,这完全取决于您的HTML,但是例如,如果您有以下HTML:

<div class="edit" id="unique_id">Editable text</div> 
<a href="#" class="edit_trigger">Edit me!!</a>
Run Code Online (Sandbox Code Playgroud)

然后您可以使用以下JavaScript:

/* Bind Jeditable instances to "edit" event. */
$(".edit").editable("http://www.example.com/save.php", {
    event     : "edit"
});
/* Find and trigger "edit" event on correct Jeditable instance. */
$(".edit_trigger").bind("click", function() {
    $(this).prev().trigger("edit");
}); 
Run Code Online (Sandbox Code Playgroud)

  • 值得注意的是,在某些情况下,`$(this).prev()`可能不一定是您实际想要设置可编辑模式的元素.(在这个例子中,它是.)选择`$("#unique_id")`或`$(".edit [id ='unique_id']")`可能更耐用,以确保你正在编辑正确的元素. (3认同)