2

你好 StackOverflow 社区！

我目前正在开发我自己的用于内联编辑的 jQuery 插件，因为那些已经存在的插件不符合我的需求。

无论如何，我想为用户提供以下关于编辑应该如何工作的（布尔）选项：

  • 提交按钮
  • reset_on_blur

假设用户想要一个提交按钮（submit_button = true）并希望内联输入元素在失去焦点后立即被删除（reset_on_blur = true）。这会导致为按钮注册一个 onClick 处理程序，并为输入元素注册一个 onBlur 处理程序。

然而，每次用户单击按钮时，也会触发 onBlur 处理程序并导致离开编辑模式，即在 onClick 事件发生之前。这使得提交变得不可能。

仅供参考，编辑模式下的 HTML 如下所示：

<td><input type="text" class="ie-input" value="Current value" /><div class="ie-content-backup" style="display: none;">Backup Value</div><input type="submit" class="ie-button-submit" value="Save" /></td>

那么，如果在激活提交按钮时焦点丢失，有什么方法可以检查 onBlur 处理程序，以便在触发提交按钮的 onClick 事件之前不会离开编辑模式？

我还尝试注册一个 $('body').click() 处理程序来模拟模糊并能够追溯单击了哪个元素，但这也不起作用并导致了相当奇怪的错误：

$('html').click(function(e) { // body doesn't span over full page height, use html instead

 // Don't reset if the submit button, the input element itself or the element to be edited inline was clicked.
 if(!$(e.target).hasClass('ie-button-submit') && !$(e.target).hasClass('ie-input') && $(e.target).get(0) != element.get(0)) {  
  cancel(element);
 }
});

jEditable 使用以下代码。不过，由于延迟，我不喜欢这种方法。更不用说我什至不明白为什么会这样。;)

input.blur(function(e) {
 /* prevent canceling if submit was clicked */
 t = setTimeout(function() {
  reset.apply(form, [settings, self]);
 }, 500);
});

提前致谢！

4

2 回答 2

3

将提交绑定到mousedown/keydown事件而不是click; 他们都开火了blur。然后，如果需要，您可以使用unbind或类检查等取消或取消模糊事件。

编辑：如果您不幸按下按钮，这将不起作用，所以它可能不是理想的方式......

于 2010-03-26T14:48:18.283 回答
0

如果您希望 onblur 和 onclick 都触发，请使用 onfocus 而不是 onClick 作为按钮。这将首先触发 onblur 事件，然后触发 onFocus。将代码从 OnClick 复制到 OnFocus 事件，它会很好用。

                    $(document).off('focus', '#Button1');
                    $(document).on('focus', '#Button1', function (e) {

                        // ur work.
                        }

                    });
于 2015-06-19T11:03:28.873 回答