1

我有一个需要在表单中的搜索框，以便它可以发布到另一个页面以使搜索功能起作用。我最初通过使用 iFrame 在 Firefox 中正常工作，但使用搜索框只会在使用 Internet Explorer 时刷新。

我发现如果我只是在当前表单下创建另一个表单，它工作得很好，但这显然将它留在页面上的错误位置。

我尝试使用已在网站其他地方成功使用的 jQuery clone() 方法，但这无法正常工作。

我环顾四周，发现了另一种使用 clone() 方法的方法，我让它在 jsfiddle 中运行良好，但它在我的网站上不起作用。

这是我要填充的 div：

 <div id="CustomerSearch">
 2
 </div>

这是我要克隆的 div：

 <form name="frmCustomerList" action="../CustomerList/default.asp" method="post">
      <div id="CustomerSearchClone"> 
          1
    Customer Search: <br />
        <input type="text"id="txtSearch" name="txtSearch" class="Searchbox" />
         <input type="submit" value="View" name="txtSearchSubmit" />
    </div>
           </form>

这是我在外部文件中使用的脚本：

var CustomerSearch = jQuery('#CustomerSearch');
var CustomerSearchClone = jQuery('#CustomerSearchClone');

CustomerSearch.html(CustomerSearchClone.clone(true));

我在这里在 JSFiddle 工作：http: //jsfiddle.net/de9kc/92/

有任何想法吗？

多谢你们

4

1 回答 1

0

我不是 .NET 人，但您粘贴的 div 仍然在表单标记内，所以我不确定这不会在提交时（或回发或其他）导致 .NET 出现问题。

但是，关于根据您在问题中展示的布局将克隆的表单元素放在您想要的位置；

我修改了预结果html，如下所示：

//html
<form id="form1" runat="server">
    <div id="CustomerSearch">2 Customer Search:</div>
</form>

<form name="frmCustomerList" action="../CustomerList/default.asp" method="post">
    <div id="CustomerSearchClone">1 Customer Search:
        <br />
        <input type="text" id="txtSearch" name="txtSearch" class="Searchbox" />
        <input type="submit" value="View" name="txtSearchSubmit" />
    </div>
</form>

然后我使用了这个 jQuery：

// the vars you already created
var CustomerSearch = jQuery('#CustomerSearch');
var CustomerSearchClone = jQuery('#CustomerSearchClone');

// using .clone(true, true) for deepWithDataAndEvents - not sure if you want this?
// will the .clone(true, true) retain input's link to original form id? I'm uncertain 
// using .children() because clone's intended destination already has a div container
CustomerSearchClone.children().clone(true, true).appendTo(CustomerSearch);

// hide clone's source after cloning; no sense in having both search boxes visible
CustomerSearchClone.hide();

注意：使用 .clone() 具有产生具有重复 id 属性的元素的副作用，这些属性应该是唯一的。（根据http://api.jquery.com/clone/）

但是您将克隆的元素附加到不同的表单标签中，所以可能不是问题。

我自己只是在学习 jQuery，但我想我会尝试一下解决方案；-$

JSFiddle在这里：http: //jsfiddle.net/de9kc/190/

于 2014-01-09T03:32:47.393 回答