Javascript 当数据通过其他代码更改时，不会在文本框上触发更改事件

我需要在元素上触发一个更改事件，而不考虑元素值是如何更改的

我在这里的用例是，每当一个特定的文本框改变值时，我需要改变表单上的元素。问题在于，该元素由另一个按钮填充（一个日历按钮，允许用户选择一个日期，然后插入到第一个文本框中）

使用下面的示例，我需要知道“date1”何时更改，以便更新“date2”我不知道按钮的ID——它是由另一个工具动态生成的——因此我不能附加任何内容。

我有以下HTML：

 <input type="text" id="date1" value="" />
 <input type="button" id="but1" value="click me" />
 <br/>
 <input type="text" id="date2" value="" />

下面是我使用的一个JSFIDLE：

更新：我在jsfiddle示例中添加了一个DIV包装器，希望能激发另一个解决方案。我自己找不到利用它的方法，但我的javascript技能相当平庸

关于Fabricio关于DOM突变的评论，是否有一种与浏览器无关的DOM突变解决方案？我无法确定地预测这里将使用的浏览器。我不太关心IE6，但我见过的为数不多的DOM突变解决方案似乎都集中在Chrome上。

引发了这一事件

$(function () {

    $("#but1").click(function () {
        $("#date1").val(new Date().toLocaleDateString()).change();
    });

    $("#date1").change(function () {
        var d = new Date($("#date1").val());
        $("#date2").val(d.addDays(7));
    });

});

Date.prototype.addDays = function (days) {
    var current = this;
    current.setDate(current.getDate() + days);
    return current;
};

长期：

$("#date1").val(new Date().toLocaleDateString()).trigger('change');

编辑：根据您的澄清：

$(function () {
    $("#date1").next('input[type=button]').on('click',function () {
        $("#date1").val(new Date().toLocaleDateString()).change();
    });

    $("#date1").change(function () {
        var d = new Date($("#date1").val());
        $("#date2").val(d.addDays(7));
    });
});

Date.prototype.addDays = function (days) {
    var current = this;
    current.setDate(current.getDate() + days);
    return current;
};

注意：此示例将它们放在同一个表格单元格中。如果在后续表格单元格中，请使用：

 $("#date1").next('td input[type=button]')

解雇事件

$(function () {

    $("#but1").click(function () {
        $("#date1").val(new Date().toLocaleDateString()).change();
    });

    $("#date1").change(function () {
        var d = new Date($("#date1").val());
        $("#date2").val(d.addDays(7));
    });

});

Date.prototype.addDays = function (days) {
    var current = this;
    current.setDate(current.getDate() + days);
    return current;
};

长期：

$("#date1").val(new Date().toLocaleDateString()).trigger('change');

编辑：根据您的澄清：

$(function () {
    $("#date1").next('input[type=button]').on('click',function () {
        $("#date1").val(new Date().toLocaleDateString()).change();
    });

    $("#date1").change(function () {
        var d = new Date($("#date1").val());
        $("#date2").val(d.addDays(7));
    });
});

Date.prototype.addDays = function (days) {
    var current = this;
    current.setDate(current.getDate() + days);
    return current;
};

注意：此示例将它们放在同一个表格单元格中。如果在后续表格单元格中，请使用：

 $("#date1").next('td input[type=button]')

---

change

仅当文本输入在获得焦点后更改其值后失去焦点时，才会激发文本输入。无焦点=无更改事件。从JS中更改后，您可以触发一个合成的

.change（）

事件，但如果您确实需要监视输入的值，则需要一个DOM变异观察器，它主要是一个黑客。

change

仅在输入在获得焦点后更改其值后失去焦点时触发文本输入。无焦点=无更改事件。在JS中更改后，您可以触发一个合成的

.change（）

事件，但如果您确实需要监视输入的值，则需要一个DOM变异观察器，它主要是一个黑客程序。虽然这样做可以忽略我在问题中提到的一点，即我实际上没有访问按钮的权限。我不知道它的名称或ID。我需要一个只查看文本框的解决方案。因此，为了澄清，您不知道

但1

输入按钮的ID？如果这是正确的，您知道它的包装器/包含元素的id吗？它位于我可以确定的表单元格中。我也知道它前面紧跟着“date1”文本框。在以后的问题中，请通过提供完整的上下文标记和对您的挑战的真正清晰的解释来帮助我们。您是对的，但有时很难预见什么信息对获得答案是有价值的。我可能会提供几千行代码来清楚地定义这个问题，但我专注于我觉得我真正需要的东西。。。一种总是检测文本框内容何时更改的方法。虽然这种方法有效，但它忽略了我在问题中提到的一点，即我实际上没有访问按钮的权限。我不知道它的名称或ID。我需要一个只查看文本框的解决方案。因此，为了澄清，您不知道

但1

输入按钮的ID？如果这是正确的，您知道它的包装器/包含元素的id吗？它位于我可以确定的表单元格中。我也知道它前面紧跟着“date1”文本框。在以后的问题中，请通过提供完整的上下文标记和对您的挑战的真正清晰的解释来帮助我们。您是对的，但有时很难预见什么信息对获得答案是有价值的。我可能会提供几千行代码来清楚地定义这个问题，但我专注于我觉得我真正需要的东西。。。始终检测文本框内容何时更改的一种方法。