将 HTML 字符串转换为 jQuery 对象然后解析它时出现问题

Question

我设置了一个小片段，它将从 textarea 获取用于电子邮件营销的自动回复代码，当 textarea 失去焦点时，它会解析刚刚粘贴的内容并从中获取一些属性和元素，然后将它们位于单独的输入字段中。

问题是我编写的代码显然没有正确执行此操作，对于某些自动应答器代码，它不会抓取表单的操作 URL，有些它会抓取所有隐藏的输入字段，通常没有问题，然后有时不想抓取姓名或电子邮件字段的“姓名”属性。

代码非常简单。我尝试使用 .find() 而不是 .filter() ，它似乎只是随机起作用。有些功能可以在 .find() 中使用，但有些功能可以在 .find() 中使用。我认为这不是问题的根源，但可能有助于解释正在发生的事情。

编辑它似乎与.find()一起工作“更好”。

我只是不知道为什么它会这样，有什么想法吗？

插入文本区域的 HTML 表单示例在这里。 （它很乱，但不是我写的！） -- 这段代码将位于 textarea 中，其中下面的代码在失去焦点时对其进行解析。

编辑：问题的根源似乎是

部分。

• 例如，Aweber 代码将不会检索表单 URL（action 属性)

• Ebizac 代码 不会检索表单 URL

• Imnica 代码 现在显然工作正常了（？）。

• GetResponse Code 没有问题。

最新的 JSFiddle <- 代码在这里

Answer 1

我相信 html 的问题不像您的 AWeber 示例那样工作，而是它不包含在单个顶级父元素中，这意味着当您解析它以创建 arcode jQuery 时object 该对象包含

元素作为顶级元素。这反过来意味着 .find() 方法（查找后代元素）找不到任何内容，因为没有其他 元素是子元素。 （您可以通过检查 arcode.length 或使用 arcode.each() 记录 arcode 中元素的标记名来自行测试。 ）

您的示例确实有效，恰好包含在顶级

中，因此它没有此问题。

因此，我建议的修复方法就是将输入的 html 自己包装在

元素中，从而使所有内容都可以与 .find() 一起使用。然后简化您的功能，因为以下简短版本可以完成您原始功能所做的所有工作：

$j( '#jwsqz_autocode' ).blur( function() {

    var thehtml = "<div>" + $j( this ).val() + "</div>";
    var arcode = $j( thehtml );

    $j('#jwsqz_autoformurl').val( arcode.find('form').attr('action') );
    $j('#jwsqz_arnameinput').val(
         arcode.find('input[type="text"][name*="name"]').attr('name') );
    $j('#jwsqz_aremailinput').val(
         arcode.find('input[type="text"][name*="email"]').attr('name') );

    var hiddens = "";

    arcode.find( 'input[type="hidden"]' ).each( function() {
       hiddens += $j( this ).prop( 'outerHTML' ) + "\n";
    });

    $j( '#jwsqz_autohidden' ).val( hiddens );

});

工作演示： http:// jsfiddle.net/fpK9F/6/ （似乎可以处理您的示例案例）。

您会注意到我使用了 jQuery 属性包含选择器 和 [名称*=“电子邮件”]。

请注意，如果代码中的以下测试是多余的：

if( hiddens != '' )
   $j( '#jwsqz_autohidden' ).val( hiddens );
else
   $j( '#jwsqz_autohidden' ).val( '' );

在 else 情况下，您无论如何都要设置 hiddens 变量中的值，因此您可以替换整个仅包含 if 部分的结构 - 正如我在上面的代码中所做的那样。

更新：对于 name 属性值的不区分大小写的测试，您可以这样做：（

    $j('#jwsqz_aremailinput').val(
         arcode.find('input[type="text"]')
               .filter(function(){ return /email/i.test(this.name); })
               .attr('name') );

您不必使用正则表达式，关键点是 .filter()< /code> 函数。）

不区分大小写的演示： http://jsfiddle.net/fpK9F/7/