使用.trigger（）時，JavaScript更改事件未觸發

Question

我已經編寫了一個JavaScript .change()事件，因此當單選按鈕選擇更改時，會發生不同的事情，當我手動進行此更改時，該事件將觸發並且一切正常。 不起作用的是，當我在單選按鈕上調用.trigger("change")命令時，由於.change()調用中的任何代碼均未運行，因此該事件似乎未觸發。 通過JavaScript代碼觸發事件的正確方法是什么？

這是我用來進行事件調用的代碼：

$("input[name=TimespanEntryMode]").trigger("change");

這是應該在變更事件上運行的代碼：

$("input[name=TimespanEntryMode]").change(function ()
{
    $("#TimeEntryStartTime").toggleClass("hidden");
    $("#TimeEntryEndTime").toggleClass("hidden");
    $("#TimeEntryDuration").toggleClass("hidden");
    $(".timeEntryBox").val("");
});

按照要求的HTML：

    <li>
    <label>Time Entry Mode:</label>

    <label class="normal">
        <input type="radio" id="TimeEntryModeTime" name="TimespanEntryMode" value="true" checked="checked" />Time
    </label>

    <label class="normal">
        <input type="radio" id="TimeEntryModeDuration" name="TimespanEntryMode" value="false" />Duration
    </label>
</li>

<li id="TimeEntryStartTime">
    <label>Start Time:</label>
    @Html.DropDownListFor(m => m.SelectedStartDay, Model.DaysOfTheWeek, new { @class = "dayOfTheWeekSelector", @id = "SelectedStartDay" })
    @Html.EditorFor(m => m.StartTime, new { htmlAttributes = new { @class = "timeEntryBox", @id = "StartTimeEntryBox", @readonly = "readonly" } })
</li>

<li id="TimeEntryEndTime">
    <label>End Time:</label>
    @Html.DropDownListFor(m => m.SelectedEndDay, Model.DaysOfTheWeek, new { @class = "dayOfTheWeekSelector", @id = "SelectedEndDay" })
    @Html.EditorFor(m => m.EndTime, new { htmlAttributes = new { @class = "timeEntryBox", @id = "EndTimeEntryBox", @readonly = "readonly" } })
</li>

<li id="TimeEntryDuration" class="hidden">
    <label>Duration:</label>
    @Html.DropDownListFor(m => m.SelectedStartDay, Model.DaysOfTheWeek, new { @class = "dayOfTheWeekSelector", @id = "SelectedDurationStartDay", @Name = "SelectedDurationStartDay" })
    H:@Html.DropDownListFor(m => m.SelectedDurationHour, Model.DurationHours, new { @class = "durationTime", @id = "DurationHour" })
    M:@Html.DropDownListFor(m => m.SelectedDurationMinute, Model.DurationMinutes, new { @class = "durationTime", @id = "DurationMinute" })
</li>

Answer 1

您必須指定要觸發更改的無線電之一：

$("input[name=TimespanEntryMode]:eq(index_here)").trigger("change");
____________________________________^^^^^^^^^^

希望這可以幫助。

 $("#toggle").on('click', function(){ $("input[name=TimespanEntryMode]:eq(0)").trigger("change"); }); $("input[name=TimespanEntryMode]").change(function (){ alert('toggle'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <li> <label>Time Entry Mode:</label> <label class="normal"> <input type="radio" id="TimeEntryModeTime" name="TimespanEntryMode" value="true" checked="checked" />Time </label> <label class="normal"> <input type="radio" id="TimeEntryModeDuration" name="TimespanEntryMode" value="false" />Duration </label> </li> <button id='toggle'>Toggle</button>