Javascript 触发更改事件或修复querySelectorAll/document.getElementsByClass名称

Javascript 触发更改事件或修复querySelectorAll/document.getElementsByClass名称,javascript,jquery,html,for-loop,selectors-api,Javascript,Jquery,Html,For Loop,Selectors Api,好的,我已经阅读了关于querySelectorAll和getElementsByClassName和none的其他几个答案 以下是HTML: <input class="date_input" autocomplete="off" type="text" name="aai_funded_date_c" id="aai_funded_date_c" value="11/26/2015" title="" tabindex="0" size="11" maxlength="10">

好的,我已经阅读了关于querySelectorAll和getElementsByClassName和none的其他几个答案

以下是HTML:

<input class="date_input" autocomplete="off" type="text" name="aai_funded_date_c" id="aai_funded_date_c" value="11/26/2015" title="" tabindex="0" size="11" maxlength="10">
<img src="themes/SuiteR/images/jscalendar.gif?v=TYz8pPCJ_YWjY6_eaNf7xg" alt="Enter Date" style="position:relative; top:6px" border="0" id="aai_funded_date_c_trigger">

单击日历按钮时,如果单击右侧,则显示的html为:

<div class="yui-calcontainer single" id="aai_funded_date_c_trigger_div">
    <table cellspacing="0" class="yui-calendar y2015" id=
    "aai_funded_date_c_trigger_div_t">
        <thead>
            <tr>
                <th class="calhead" colspan="7">
                    <div class="calheader">
                        <a class="calnavleft" href="#">Previous Month
                        (October 2015)</a> <a class="calnav" href=
                        "#">November 2015</a> <a class="calnavright" href=
                        "#">Next Month (December 2015)</a>
                    </div>
                </th>
            </tr>
            <tr class="calweekdayrow">
                <th class="calweekdaycell">Sun</th>
                <th class="calweekdaycell">Mon</th>
                <th class="calweekdaycell">Tue</th>
                <th class="calweekdaycell">Wed</th>
                <th class="calweekdaycell">Thu</th>
                <th class="calweekdaycell">Fri</th>
                <th class="calweekdaycell">Sat</th>
            </tr>
        </thead>
        <tbody class="m11 calbody">
            <tr class="w45">
                <td class=
                "calcell wd0 d1 selectable calcelltop calcellleft" id=
                "aai_funded_date_c_trigger_div_t_cell0">
                    <a class="selector" href="#">1</a>
                </td>
                <td class="calcell wd1 d2 selectable calcelltop" id=
                "aai_funded_date_c_trigger_div_t_cell1">
                    <a class="selector" href="#">2</a>
                </td>
                <td class="calcell wd2 d3 selectable calcelltop" id=
                "aai_funded_date_c_trigger_div_t_cell2">
                    <a class="selector" href="#">3</a>
                </td>
                <td class="calcell wd3 d4 selectable calcelltop" id=
                "aai_funded_date_c_trigger_div_t_cell3">
                    <a class="selector" href="#">4</a>
                </td>
                <td class="calcell wd4 d5 selectable calcelltop" id=
                "aai_funded_date_c_trigger_div_t_cell4">
                    <a class="selector" href="#">5</a>
                </td>
                <td class="calcell wd5 d6 selectable calcelltop" id=
                "aai_funded_date_c_trigger_div_t_cell5">
                    <a class="selector" href="#">6</a>
                </td>
                <td class=
                "calcell wd6 d7 selectable calcelltop calcellright" id=
                "aai_funded_date_c_trigger_div_t_cell6">
                    <a class="selector" href="#">7</a>
                </td>
            </tr>
            <tr class="w46">
                <td class="calcell wd0 d8 selectable calcellleft" id=
                "aai_funded_date_c_trigger_div_t_cell7">
                    <a class="selector" href="#">8</a>
                </td>
                <td class="calcell wd1 d9 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell8">
                    <a class="selector" href="#">9</a>
                </td>
                <td class="calcell wd2 d10 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell9">
                    <a class="selector" href="#">10</a>
                </td>
                <td class="calcell wd3 d11 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell10">
                    <a class="selector" href="#">11</a>
                </td>
                <td class="calcell wd4 d12 selected selectable" id=
                "aai_funded_date_c_trigger_div_t_cell11">
                    <a class="selector" href="#">12</a>
                </td>
                <td class="calcell wd5 d13 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell12">
                    <a class="selector" href="#">13</a>
                </td>
                <td class="calcell wd6 d14 selectable calcellright" id=
                "aai_funded_date_c_trigger_div_t_cell13">
                    <a class="selector" href="#">14</a>
                </td>
            </tr>
            <tr class="w47">
                <td class="calcell wd0 d15 selectable calcellleft" id=
                "aai_funded_date_c_trigger_div_t_cell14">
                    <a class="selector" href="#">15</a>
                </td>
                <td class="calcell wd1 d16 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell15">
                    <a class="selector" href="#">16</a>
                </td>
                <td class="calcell wd2 d17 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell16">
                    <a class="selector" href="#">17</a>
                </td>
                <td class="calcell wd3 d18 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell17">
                    <a class="selector" href="#">18</a>
                </td>
                <td class="calcell wd4 d19 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell18">
                    <a class="selector" href="#">19</a>
                </td>
                <td class="calcell wd5 d20 today selectable" id=
                "aai_funded_date_c_trigger_div_t_cell19">
                    <a class="selector" href="#">20</a>
                </td>
                <td class="calcell wd6 d21 selectable calcellright" id=
                "aai_funded_date_c_trigger_div_t_cell20">
                    <a class="selector" href="#">21</a>
                </td>
            </tr>
            <tr class="w48">
                <td class="calcell wd0 d22 selectable calcellleft" id=
                "aai_funded_date_c_trigger_div_t_cell21">
                    <a class="selector" href="#">22</a>
                </td>
                <td class="calcell wd1 d23 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell22">
                    <a class="selector" href="#">23</a>
                </td>
                <td class="calcell wd2 d24 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell23">
                    <a class="selector" href="#">24</a>
                </td>
                <td class="calcell wd3 d25 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell24">
                    <a class="selector" href="#">25</a>
                </td>
                <td class="calcell wd4 d26 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell25">
                    <a class="selector" href="#">26</a>
                </td>
                <td class="calcell wd5 d27 selectable" id=
                "aai_funded_date_c_trigger_div_t_cell26">
                    <a class="selector" href="#">27</a>
                </td>
                <td class="calcell wd6 d28 selectable calcellright" id=
                "aai_funded_date_c_trigger_div_t_cell27">
                    <a class="selector" href="#">28</a>
                </td>
            </tr>
            <tr class="w49">
                <td class=
                "calcell wd0 d29 selectable calcellleft calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell28">
                    <a class="selector" href="#">29</a>
                </td>
                <td class="calcell wd1 d30 selectable calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell29">
                    <a class="selector" href="#">30</a>
                </td>
                <td class="calcell oom calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell30">1</td>
                <td class="calcell oom calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell31">2</td>
                <td class="calcell oom calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell32">3</td>
                <td class="calcell oom calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell33">4</td>
                <td class="calcell oom calcellright calcellbottom" id=
                "aai_funded_date_c_trigger_div_t_cell34">5</td>
            </tr>
        </tbody>
    </table>
</div>

太阳
周一
星期二
结婚
清华大学
星期五
坐
1.
2.
3.
4.
5.
下面是我正在调用的函数:

function dateChange(control_date, calc_date, return_date) {
    var date1 = new Date($('#' + control_date).html());
    var date2 = new Date($('#' + calc_date).val());
    var timeDiff = Math.abs(date2.getTime() - date1.getTime());
    var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
    $('#' + return_date).val(diffDays);
}
var text = "";
var i;
for (i = 0; i <= 34; i++) {
    text += $("#aai_funded_date_c_trigger_div_t_cell" + i).on("click", function () {
        dateChange('date_entered', 'aai_funded_date_c', 'final_day_count_to_funding_c');
    });
}
函数日期更改(控制日期、计算日期、返回日期){
var date1=新日期($('#'+控制日期).html());
var date2=新日期($('#'+计算日期).val());
var timeDiff=Math.abs(date2.getTime()-date1.getTime());
var diffDays=数学单元(timeDiff/(1000*3600*24));
$(“#”+返回日期).val(diffDays);
}
var text=“”;
var i;

对于(i=0;i如果您想使用
.val()
启用更改触发器,只需手动执行即可

附上你的更改

$('#someId').on('change',
    function () {
        // do something
    }
);
然后在使用
.val()
更新值后立即手动触发该值:

$('#someId').val('someValue')
$('#someId').trigger('change');

至于
querySelectorAll
getElementsByClassName
不起作用,您试图调用的似乎都不是文档或不是合适的元素节点,但因为您的代码没有显示我只能猜测。

可能不是最佳解决方案,但我的最终解决方案是:

$('#content').on("mouseover", function(){
                        var date1 = new Date($('#date_entered').html());
                        var date2 = new Date($('#aai_funded_date_c').val());
                        var timeDiff = Math.abs(date2.getTime() - date1.getTime());
                        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24)); 

                        $('#final_day_count_to_funding_c').val(diffDays);
                        });
我决定忘记日历,当他们选择日期后在页面主体上移动鼠标时,该函数就会触发