jQuery错误解决：意外地调用了方法或属性访问

最新推荐文章于 2020-05-28 11:35:02 发布

爱码僧

最新推荐文章于 2020-05-28 11:35:02 发布

阅读量3.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： WEB jquery

本文链接：https://blog.youkuaiyun.com/qq_33666602/article/details/80516614

WEB 同时被 2 个专栏收录

2 篇文章

订阅专栏

jquery

2 篇文章

订阅专栏

本文介绍了一种在Internet Explorer浏览器中动态更改HTML内容时遇到的问题及解决方案。问题表现为使用jQuery进行DOM操作时出现错误，原因是IE对动态添加的内容有特定的要求。通过调整DOM结构，在`tr`元素外部包裹`table`标签，成功解决了该问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题现象：动态的改变HTML元素的内容时发生以下js报错：

报错位置：位于jQuery.js的代码片段

append:function(){

return this.domManip(arguments,true,function(E){

if(this.nodeType==1) {

this.appendChild(E)

}

})}

jQuery错误解决：意外地调用了方法或属性访问

JS代码:

function toPreCalc() {

    if(validisOrNotSelected()) {

        $("#noticed").html("已勾选的产品");

    }else{

        $("#noticed").html("所有存在自营客户存续份额的产品");

    }

}

function validisOrNotSelected (){

    var count = $("input[name='serial_no']:checked").length;

    return (count>0);

}

DOM结构：

<div align="center"><br/>

    <tr>

        <td width="80px" align="left" nowrap="nowrap" >预算日期：</td>

        <td align="left" nowrap="nowrap" colspan="2">

        <input type="text" id="preCalcDate" name="preCalcDate" class="Wdate" onfocus="WdatePicker()" size="15" value="<%= preCalcDate %>"/>

        </td><br/>

    </tr>

    <tr>

        <td width="80px" align="left" nowrap="nowrap" name="notice">
            <font>计算范围：</font>            
        </td>

        <td align="left" nowrap="nowrap" id="noticed" name="notice">
            <font> </font>
        </td>

    </tr><br/>

</div>

解决过程：

查资料发现该问题的产生原因为：ie对动态append的内容有要求，需要将一个具有完整意义的html一起append到代码中。

仔细检查发现，我的div里直接以tr元素开始了，这对于要求严格的IE来说显然不符合其规定，从严谨的角度来讲；tr元素必须是在table元素里才算是完整的html代码。

然后再tr外再加了一个table元素，问题得以完美解决~

以下是修改后的DOM结构：

<div align="center"><br/>

    <table>

        <tr>

            <td width="80px" align="left" nowrap="nowrap" >预算日期：</td>

            <td align="left" nowrap="nowrap" colspan="2">

            <input type="text" id="preCalcDate" name="preCalcDate" class="Wdate" onfocus="WdatePicker()" size="15" value="<%= preCalcDate %>"/>

            </td><br/>

        </tr>

        <tr>

            <td width="80px" align="left" nowrap="nowrap" name="notice">
                <font>计算范围：</font>
            </td>

            <td align="left" nowrap="nowrap" id="noticed" name="notice">
                <font> </font>
            </td>

        </tr><br/>

    </table>

</div>