X - 单击其他元素时可编辑的可编辑输入

Posted

技术标签:

【中文标题】X - 单击其他元素时可编辑的可编辑输入【英文标题】:X - editable input editable on click on other element 【发布时间】:2013-05-29 06:32:15 【问题描述】:

我有一个 x-editable 输入,用于编辑用户名。元素的默认操作是当您单击其自身时,您可以编辑一个值。但我想启用单击元素的 .editable 并能够编辑输入中的值。在这里缩短内容是a jsfiddle我目前的情况。

jQuery:

$(function()
  $.fn.editable.defaults.mode = 'inline';
  $('#publicname-change').editable(
    type: 'text',
    url: '/post',
    pk: 1,
    placement: 'top',
    title: 'Enter public name'
  
);

//ajax emulation. Type "err" to see error message
$.mockjax(
  url: '/post',
  responseTime: 100,
  response: function(settings) 
    if(settings.data.value == 'err') 
      this.status = 500;
      this.responseText = 'Validation error!';
     else 
      this.responseText = '';
    
  
); 

html

<div class="control-group control-group-inline">
  <label class="control-label labelModified" for="publicname-change">Public name:</label>
  <div class="controls">
    <a href="#" id="publicname-change" class="editable editable-click inline-input">Mr.    Doe</a>
    <div class="edit">edit <i class="icon-pencil pencil-input-change"></i></div>
  </div>
</div>

如果有人可以帮助我并按照我描述的方式编辑我链接的 jsfiddle,那就太好了。点击.edit,就可以编辑值了。

【问题讨论】:

【参考方案1】:

它有一个叫做 enable 的函数,你可以用它来启用编辑

$('.edit').click(function(e)    
       e.stopPropagation();
       $('#publicname-change').editable('toggle');
);

如果您不添加第一行,这将不起作用,因为默认行为是禁用单击任何其他元素时的编辑。

编辑:

要仅在单击编辑按钮而不是文本时启用编辑,请将toggle 属性设置为manual

$('#publicname-change').editable(
    type: 'text',
    url: '/post',
    pk: 1,
    placement: 'top',
    title: 'Enter public name',
    toggle:'manual'

JSFiddle

【讨论】:

谢谢,但我没能解决它...你能这么好心并在我的 jsfiddle 中编辑它吗? jsfiddle.net/jjdJX 我刚刚更新了你的 jsfiddle,检查一下,我不知道 jsfiddle 是如何工作的,所以这里是链接jsfiddle.net/jjdJX/1 我还有一个问题......也许你可以帮助我,所以我不会在***上问另一个问题。我想这样做,所以当点击 .edit 时,它会被隐藏...... 不,当点击编辑时,它会被隐藏,你修改你的输入,点击检查按钮,然后它再次显示......与现在显示的两个按钮相反。你明白了吗? 简而言之,我希望它在被点击时被禁用,我认为首先我们的意思是一样的,很抱歉误解了。那么如何制作以便在再次单击编辑时将其禁用?

以上是关于X - 单击其他元素时可编辑的可编辑输入的主要内容,如果未能解决你的问题,请参考以下文章

使用jquery单击按钮时可编辑的引导表行

iOS - 使 UITableView 与自定义单元格在按钮单击时可编辑

如何使每个单元格在 jquery 数据表中单击按钮时可编辑

x 动态上的可编辑值更改不起作用

如何在单击按钮时使 ag 网格中的所有单元格可编辑

编辑按钮 onclick 的文本