Question

我想知道我是否可以使用jQuery重新编码输入表单的HTML。例如，我想“条带化”用户手动输入表单文本区域的HTML表格代码。如果textarea具有id = tablecode，则无法执行

$('textarea#tablecode tr:even').addClass('table_even');

有没有办法使用jQuery来操作用户输入表单框的html？或者我是否需要将表单提交给服务器，然后在PHP中使用正则表达式来添加我的类？谢谢。

Answer 1

试

var code = $('textarea#tablecode')[0].value;
var parsedHTML = $(code);

你有一个带有解析HTML的jQuery对象。然后你可以操纵它

$("tr:even", parsedHTML).addClass('table_even");

并可选择将更改放回textarea。

$('textarea#tablecode')[0].value = parsedHTML[0].outerHTML;

Answer 2

您需要将文本拉出textarea并从中创建一个DOM节点。（然后，如果需要，您可以将其序列化为字符串并将其放回textarea中。）

Answer 3

不直接，因为文本区域的内容只是文本..

然而，你可以读取textarea的值并创建一个内存中的表示（只要它是有效的html ），并处理它。

$('#convert').click(function(){
  var $html = $( $('#tablecode').val() ).wrapAll('<div />').parent();

    // manipulate html
  $('tr:even', $html).addClass('table_even');

    //show altered html in another textarea with id=result
    $('#result').val($html.html());
});

演示 http://jsfiddle.net/gaby/f4FuG/

Answer 4

ID适用于单个元素。它们必须是独一无二的尝试将ID更改为班级，并将#更改为.。

Answer 5

textarea模型是纯文本。所以这个选择器$('textarea#tablecode tr:even')根本行不通。

您需要将文本传递给html解析器才能获得DOM。然后修改它。然后将其序列化为HTML。

此 Robust and Mature HTML Parser for PHP可能很有用。

你能用jQuery来操作输入到表单文本区域的html吗？

5 个答案: