7

当我单击编辑某些文本时，Jeditable 会为我在文本区域中的实际文本周围插入额外的空格。我该如何修剪或实际解决这个问题？

4

8 回答 8

18

您实际上可以只传递一个函数来修剪您要编辑的字符串。在您的设置中使用它：

data    : function(string) {return $.trim(string)},
submit: "Save"
于 2012-01-31T21:28:30.387 回答
12

找到了原因。这太疯狂了！

如果您的 html 如下所示，就地编辑将在文本周围插入空格

<div id="inplace_edit_this">
     This is some text that will be edited in-place.
</div>

如果您的 html 看起来像这样，它不会在文本周围插入空格

<div id="inplace_edit_this">This is some text that will be edited in-place.</div>

我想知道这是什么原因造成的。这可能是因为浏览器和 Javascript 解释 HTML 的方式不同。

于 2010-04-14T13:48:42.973 回答
8

这可能是旧消息，但我遇到了类似的问题：我还不知道为什么，但是在保存编辑过的文本输入后，下次我点击它时，在可编辑之前插入了 11 个空格（每次）文本。

经过大量的试验和错误，我终于通过编辑 jeditable.js 文件中的 ~239 行解决了这个问题：

content.apply(form, [input_content, settings, self]);

并将其替换为：

content.apply(form, [$.trim(input_content), settings, self]);

（根据Baloneysammitch的建议）

请注意，我几乎不知道自己在做什么，但这似乎有效！也许比我更有技巧的人可以解释那些额外的 11 个空格可能来自哪里......

于 2010-12-19T23:47:41.917 回答
3

我已经在我的应用程序中使用 JEditable 1.7.1 解决了这个问题。该解决方案实际上与 Symmitchry 的解决方案相同。

从第 204 行开始，有一个代码块确定 JEditable 应如何加载其数据。

/* set input content via POST, GET, given data or existing value */
var input_content;

if (settings.loadurl) {
  ...
} else if (settings.data) {
  ...
} else {
  ...
}
content.apply(form, [input_content, settings, self]);

在最后一行（我的版本中的第 239 行）之前添加 jQuery trim-function，这样你就可以得到：

/* set input content via POST, GET, given data or existing value */
var input_content;

if (settings.loadurl) {
  ...
} else if (settings.data) {
  ...
} else {
  ...
}

try {
    input_content = input_content.trim();
}
catch(e) {
    // DO NOTHING
}

content.apply(form, [input_content, settings, self]);

我将它放在 try-catch 中的原因是，当您将 JEditable 与 textarea 或文本类型的输入一起使用时，input_content 基本上是一个字符串。当您使用 select 时 input_content 是一个对象，并且不会很好地响应被修剪。

可能有一种更漂亮的方法可以做到这一点，而不是使用 try-catch，但它可以完成工作。

于 2011-05-17T15:40:30.043 回答
1

嗯，这很奇怪。我没有遇到 Jeditable 的问题。

哦，好吧，jQuery 有一个修剪功能：

$.trim("  hello, how are you?  ");
于 2010-04-09T21:40:25.547 回答
1

已经有一段时间没有人回复这篇文章了，但我遇到了同样的问题，并认为我会增加我的两美分的价值。这个问题只发生在 Firefox 和 Safari 中。IE和chrome似乎没有这个问题。

我尝试了 Symmitchry$.trim()在第 239 行的建议，但这对我不起作用。所以我做了一些回溯，发现问题首先出现在第 176 行附近：

self.revert = $(self).html();

由于这是一个 jquery 调用，我想知道 jquery 如何与上述浏览器交互是否存在问题。没有把握...

我发现通过$.trim()在这一点上添加 a ，事情对我来说就像预期的那样。

正如 Chirantan 所做的那样，我确实发现 html 的布局方式会影响空间是否存在。

于 2011-03-24T13:28:49.387 回答
0

如果格式分配了空格，则会发生这种情况。jEditable 尊重它并且不会修改您的内容。例如，在 VS IDE 中，自动格式会产生巨大的空白，在这些空白中渲染 HTML 是可以的。

如果使用 jQuery 只是在调用 jEditable 之前修剪 DOM，如果你想确保在任何地方都没有空格

$('#BatchTable tbody td').each(function () {
      $(this).html($.trim($(this).html()));
});

oTable = $('#BatchTable').dataTable({
        "bJQueryUI": true
});
于 2012-07-10T14:34:54.143 回答
0

在我的情况下，解决方案是删除</input>文件 jquery.jeditable.js 中的第 390 行。前var input = $('<input type="hidden"></input>'); 行：对我有用的行：var input = $('<input type="hidden">');

于 2015-02-14T19:11:46.663 回答