动态添加JavaScript无法在IE中查找动态添加的字段

时间:2009-11-09 21:21:18

标签: javascript jquery dynamic yui yui-autocomplete

我有一个表格,其中有一个“添加行”按钮。此按钮使用JQuery动态添加行。它的工作原理是复制第一个...然后用增加的数字替换所有id =“..”。

问题是这些行有一个YUI AutoComplete,如下所示:

<td>
    <input type="hidden" name="location_num[0]" value="508318" maxLength="25" style="width:230px" id="location_num[0]"/>
    <input type="textbox" name="location_numDisplayDesc[0]" value="WINNIPEG" maxLength="25" style="width:230px" id="location_numDisplayDesc[0]"/>
    <div id="Container_location_num[0]" style="display:inline;"></div>

    <script type="text/javascript">

        // Initialize autocomplete
        var location_numAC = new YAHOO.widget.AutoComplete(
            "location_numDisplayDesc[0]",
            "Container_location_num[0]",
            locationDataSource,
            acConfig);

        location_numAC.useShadow = true
        location_numAC.useIFrame = true
        location_numAC.dataErrorEvent.subscribe(acErrorFunction);

        // Format results to include the reference number
        location_numAC.formatResult = function(resultItem, query) {
            return resultItem[0];
        };

        // Clear key before request
        location_numAC.dataRequestEvent.subscribe(function fnCallback(e, args) {
        YAHOO.util.Dom.get("location_num[0]").value = ""; });

        // Set key on item select
        location_numAC.itemSelectEvent.subscribe(function(event, args) {
            YAHOO.util.Dom.get("location_num[0]").value = args[2][1];
        });

        // Clear key when description is cleared
        location_numAC.textboxBlurEvent.subscribe(function fnCallback(e, args) {
            if (isEmpty(YAHOO.util.Dom.get("location_numDisplayDesc[0]").value)) {
                YAHOO.util.Dom.get("location_num[0]").value = "";
            } // end if
        });
    </script>
</td>

此代码在Firefox中运行良好,新创建的AutoCompletes工作正常,但在IE(6&amp; 7)中,我收到错误,表示location_num_AC未成功创建。我相信这是因为它没有按原样阅读新创建的输入或div。我试过用

包装javascript
$("Container_location_num[0]").ready(function {...});

但这似乎不起作用。有没有人有其他想法?

1 个答案:

答案 0 :(得分:2)

在IE中插入到DOM中的表单字段不会像您期望的那样添加到表单集合中。

通常,您可以通过以下两种方式之一引用表单字段:

document.forms[0]["myFormName"];
document.forms[0][12];

即,通过其表单字段名称或其索引。但是,当您将表单字段添加到IE中的DOM时,您不能按名称引用它,只能通过其索引引用它。如果您的代码(或任何支持代码)在其名称中查找集合中的表单字段,那么您显然遇到了问题。

如果您的唯一键是名称,您可以通过索引循环遍历所有表单字段并找到您要查找的内容,但这显然是线性操作。您还可以循环查找哪些表单字段以数字方式编制索引但不按名称编制索引并自行更新表单对象。

我没有足够的细节来了解你的项目是如何(或者是否)发生这种情况,但这是因为你动态添加字段而听起来可能扮演一个角色的IE怪癖之一。 p>