onchange 事件 - IE 错误答案

【问题标题】：onchange event - IE erroronchange 事件 - IE 错误
【发布时间】：2012-06-18 19:14:38
【问题描述】：

在我后面的代码中，我有 -

tbWhatIfBeginDate.Attributes.Add("onchange", "checkDates(" + tbWhatIfBeginDate.ClientID + ", " + tbWhatIfEndDate.ClientID + ")");
tbWhatIfEndDate.Attributes.Add("onchange", "checkDates(" + tbWhatIfBeginDate.ClientID + ", " + tbWhatIfEndDate.ClientID + ")");

这是我的 javascript 函数 -

function checkDates(BeginDateId, EndDateId) {
    if (BeginDateId.value > EndDateId.value) {
        var beginDt = new Date(BeginDateId.value);
        var endDt = new Date(EndDateId.value);

        var newDt = new Date(endDt.getTime() - (24 * 60 * 60 * 1000));

        var y = newDt.getFullYear(),
        m = newDt.getMonth() + 1, // january is month 0 in javascript     
        d = newDt.getDate();

        BeginDateId.value = [pad(m), pad(d), y].join("/");
    }
}

当我运行 Visual Studio 2010 时，它可以工作。

当我部署到我的测试服务器时，我收到一条错误消息。 "预期对象 - Line:176,Char:1"

第 176 行是 - 输入名称="ctl00$cpMain$tbWhatIfBeginDate" type="text" value="8/1/2012" id="ctl00_cpMain_tbWhatIfBeginDate" onchange="checkDates (ctl00_cpMain_tbWhatIfBeginDate, ctl00_cpMain_tbWhatIfEndDate)" style="width:70px;"

我没有看到错误。

想法？

【问题讨论】：

是 JavaScript 错误吗？然后它可能是您的 JavaScript 代码的第 176 行而不是 HTML 代码。此外，有时您需要查看下一行或上一行，然后查看 IE 所说的内容。
@yunzen - 这是一个javascript错误，但可能如何加载实际文件？我仍然很困惑为什么这可以通过 VS 而不是在我的开发服务器上工作。

标签： c# javascript

【解决方案1】：

您将 HTML 元素的 id 传递给函数，它们是字符串，但您传递它时不带引号，就好像它是一个已定义的变量一样。在onClick 范围内，还没有定义ctl00_cpMain_tbWhatIfBeginDate 这样的变量，所以你得到了一个javascript 错误。这是意料之中的——你还没有声明这样的变量。

在您的函数中，您立即尝试将这些参数视为对象，但同样，您传入了undefined，因为具有指定名称的变量不存在。他们也不应该！当您尝试通过 id 引用 DOM 节点时，您必须使用来自 document 对象的 getElementById 来“获取”相关对象。那么，ID 只是字符串。

因此，您应该传递那些用引号括起来的字符串。为此，您需要修改添加事件的两行：

tbWhatIfBeginDate.Attributes.Add("onchange", "checkDates('" + tbWhatIfBeginDate.ClientID + "', '" + tbWhatIfEndDate.ClientID + "')");
tbWhatIfEndDate.Attributes.Add("onchange", "checkDates('" + tbWhatIfBeginDate.ClientID + "', '" + tbWhatIfEndDate.ClientID + "')");

这样，字符串 id 就会传递给您的函数。然后，需要修改您的函数以根据传递的 id 获取 DOM 对象：

function checkDates(BeginDateId, EndDateId) {
    beginDate = document.getElementById(BeginDateId);
    endDate = document.getElementById(EndDateId);
    if (!beginDate || !endDate)
        return; // <--- add an error message here?
    if (beginDate.value > endDate.value) {
        var beginDt = new Date(beginDate.value);
        var endDt = new Date(endDate.value);
        // existing logic here
    }
}

文档

document.getElementById - https://developer.mozilla.org/en/DOM/document.getElementById
javascript 函数 - http://www.quirksmode.org/js/function.html
javascript 变量 - http://www.tizag.com/javascriptT/javascriptvariables.php

【讨论】：

添加单引号并不能解决问题。我想一个更广泛的问题，为什么它在 VS 2010 中工作，而不是在我的开发盒上，都没有引号？
是的。我正在实现在 page_load 上添加所需的 javascript 引用的新功能。我的组件是否可能需要在设计时添加？
尝试清空checkDates函数...只需删除函数代码并替换为function checkDates(BeginDateId, EndDateId) { alert("checkDates"); }，如果遇到同样的错误，请告诉我。
您知道加载 js 文件和日历扩展器控件是否会出现问题，以及如何/何时加载 js 文件吗？
这真的取决于文件做了什么。如果一个依赖另一个会做的事情（声明对象原型等），则需要首先加载依赖项。

【解决方案2】：

您是在 Cassini 服务器和 2003 机器之间切换吗？ MS 将控件命名更改为 IIS 7 / VS 的最新版本。我会检查您的控件的实际变量名称在呈现的 HTML 中是什么。

【讨论】：

我遵循了我过去使用的命名约定。这里的区别是我所有的 javascript 都存在于不同的文件中。