วิธีการทริกเกอร์เหตุการณ์การเปลี่ยนแปลง jQuery ในโค้ด


177

ฉันมีเหตุการณ์การเปลี่ยนแปลงที่ทำงานได้ดี แต่ฉันต้องการรับเงินคืน

ดังนั้นฉันจึงมีฟังก์ชั่นที่ถูกเรียกใช้ในการเปลี่ยนแปลงที่จะ "เปลี่ยน" รายการแบบเลื่อนลงอื่น ๆ ตามตัวเลือกคลาส (สังเกตเห็น "แบบเลื่อนลง" ซึ่งอาจมีมากกว่าหนึ่ง) การเปลี่ยนพร็อกซีนี้ไม่เรียกใช้ฟังก์ชันและล้มเหลว ฉันจะทำให้มันทำงานได้ยังไง?

รหัส

$(document).ready(function () {
    var activeDropBox = null;

    $("select.drop-box").change(function () {
        var questionId = $(this).attr("questionId");
        var selectedAnswer = $(this).val();
        activeDropBox = this;

        alert(this.questionId);

        $.ajax(
        {
            type: "POST",
            url: answerChangedActionUrl,
            data: { questionId: questionId, selectedValue: selectedAnswer },
            success: function (data) {
                SetElementVisibility(data.ShowElement, questionId);
            }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('XMLHttpRequest:' + XMLHttpRequest.responseText);
                alert('textStatus:' + textStatus);
                alert('errorThrown:' + errorThrown);
            }
        });
    });

    function SetElementVisibility(visible, questionId) {
        // I would like each child to then trigger the change event...
        $(".childOf" + questionId)[visible ? 'show' : 'hide']('slow');

        // Suggested code
        //$(".childOf" + questionId + " select").trigger("change");

        if (!visible) {
            $(".childOf" + questionId + " select").attr('selectedIndex', 0);
        }
    }
}

ข้อเสนอแนะดูเหมือนจะใช้งานได้ แต่เมื่อเหตุการณ์การเปลี่ยนแปลงทำให้ ajax โพสต์ตอนนี้ดูเหมือนว่าจะล้มเหลวที่นี่ ฉันจะเล่นกับมัน แต่นั่นเป็นคำถามอื่นที่ฉันรู้สึก


1
ระบุรหัสบางส่วนเพื่อให้เราได้ดู
Alex Rashkov

เราจะบอกคุณได้อย่างไรว่าจะทำให้มันทำงานอย่างไรเมื่อคุณไม่ได้แสดงให้เราเห็นว่ามันคืออะไร?
user113716

1
ฉันคิดว่ามันเป็นแนวคิดที่เรียบง่ายและไม่รู้สึกว่าจำเป็นต้องใช้รหัส คำตอบที่ดูเหมือนจะเข้าใจคำอธิบายของฉันและฉันพยายามแก้ปัญหาของพวกเขาตอนนี้ ถ้าฉันไม่มีความสุขฉันจะโพสต์โค้ด การใช้งานของฉันมีความซับซ้อนมากขึ้น
4imble

1
จัดเรียงมันเป็นปัญหากับฉันเปลี่ยนค่าหลังจากโพสต์ ajax ขอบคุณทุกคนสำหรับความช่วยเหลือ คำแนะนำที่โพสต์นั้นทำงานได้อย่างมีเสน่ห์
4

คำตอบ:


391

ใช้วิธีการทริกเกอร์ ()

$(selector).trigger("change");

4
มีประโยชน์มากกว่านี้change()หรือไม่? หรือมันเป็นเพียงการตั้งค่า?
Joshua Pinter

6
@JoshPinter ไม่มีผลประโยชน์ที่แท้จริงมากขึ้นการตั้งค่า แต่แน่นอนว่านามธรรมง่ายกว่าในฐานะพารามิเตอร์กว่าชื่อเมธอด
John Hartsock

การตั้งค่าก่อนที่จะเรียกเหตุการณ์การเปลี่ยนแปลงเป็นวิธีที่ดีที่สุด !!
Kapil Yadav

33

สำหรับฉัน$('#element').val('...').change()เป็นวิธีที่ดีที่สุด


ใช่! ฉันชอบอันนี้
Juan Herrera

ใช่ จะช่วยให้การเลือกตัวเลือกในเวลาเดียวกัน ฉันคิดว่าคำตอบของคุณควรจะดีที่สุดที่นี่
Sergej Fomin

20

รูปแบบที่ไม่มีพารามิเตอร์ของการเปลี่ยนแปลง ()วิธีการก่อให้เกิดchangeเหตุการณ์ คุณสามารถเขียนสิ่งที่ชอบ:

$(document).ready(function() {
    $("#yourInitialElementID").change(function() {
        // Do something here...
        $(".yourDropDownClass").change();
    });
});


8

ใช้ที่:

$(selector).trigger("change");

หรือ

$('#id').trigger("click");

หรือ

$('.class').trigger(event);

ทริกเกอร์สามารถเป็นเหตุการณ์ใด ๆ ที่จาวาสคริปต์สนับสนุน .. หวังว่าคุณทุกคนจะเข้าใจได้ง่าย

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.