Cách nhận sự kiện trao đổi giá trị thả xuống jQuery

Tôi đã thêm hai tập lệnh Tự động hoàn thành thả xuống giao diện người dùng jQuery. Bây giờ tôi muốn nhận được cả hai giá trị trên thay đổi của menu thả xuống thứ hai và muốn lưu trữ riêng biệt trong biến. Làm thế nào nó là có thể?

Bất kỳ ý tưởng hoặc đề xuất? Cảm ơn.

My Fiddle: Mẫu

Mã JS của tôi:

(function($) {
            $.widget("ui.combobox", {
                _create: function() {
                    var self = this,
                    select = this.element.hide(),
                    selected = select.children(":selected"),
                    value = selected.val() ? selected.text() : "";
                    var input = this.input = $("<input>").insertAfter(select).val(value).autocomplete({
                        delay: 0,
                        minLength: 0,
                        source: function(request, response) {
                            var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                            response(select.children("option").map(function() {
                                var text = $(this).text();
                                if (this.value && (!request.term || matcher.test(text)))
                                    return {
                                    label: text.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(request.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>"),
                                    value: text,
                                    option: this
                                };
                            }));
                        },
                        select: function(event, ui) {
                            ui.item.option.selected = true;
                            self._trigger("selected", event, {
                                item: ui.item.option
                            });
                            select.trigger("change");
                        },
                        change: function(event, ui) {
                            if (!ui.item) {
                                var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"),
                                valid = false;
                                select.children("option").each(function() {
                                    if ($(this).text().match(matcher)) {
                                        this.selected = valid = true;
                                        return false;
                                    }
                                });
                                if (!valid) {
                                    // remove invalid value, as it didn't match anything
                                    $(this).val("");
                                    select.val("");
                                    input.data("autocomplete").term = "";
                                    return false;
                                }
                            }
                        }
                    }).addClass("ui-widget ui-widget-content ui-corner-left");

                    input.data("autocomplete")._renderItem = function(ul, item) {
                        return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "</a>").appendTo(ul);
                    };

                    this.button = $("<button type='button'>&nbsp;</button>").attr("tabIndex", -1).attr("title", "Show All Items").insertAfter(input).button({
                        icons: {
                            primary: "ui-icon-triangle-1-s"
                        },
                        text: false
                    }).removeClass("ui-corner-all").addClass("ui-corner-right ui-button-icon").click(function() {
                        // close if already visible
                        if (input.autocomplete("widget").is(":visible")) {
                            input.autocomplete("close");
                            return;
                        }

                        // pass empty string as value to search for, displaying all results
                        input.autocomplete("search", "");
                        input.focus();
                    });
                },

                destroy: function() {
                    this.input.remove();
                    this.button.remove();
                    this.element.show();
                    $.Widget.prototype.destroy.call(this);
                }
            });
        })(jQuery);

        $(function() {
            /*start point value*/
            $("#pick").combobox({
                change: function() {
                    alert("changed");
                }
            });
            $("#toggle").click(function() {
                $("#pick").toggle();
            });
            $("#pick").change(function() {
                var start = this.value;
            });

            /*end point value*/
            $("#drop").combobox({
                change: function() {
                    alert("changed");
                }
            });
            $("#toggle").click(function() {
                $("#drop").toggle();
            });
            $("#drop").change(function() {
                var end = this.value;
            });
        });

Mã HTML của tôi:

<div class="ui-widget">
        <select id="pick">
            <option value="">Select one...</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
        </select>

        <select id="drop">
            <option value="">Select one...</option>
            <option value="11">11</option>
            <option value="12">12</option>
            <option value="13">13</option>
            <option value="14">14</option>
        </select>
    </div>

Hãy thử như thế này

 $("#drop").change(function () {
        var end = this.value;
        var firstDropVal = $('#pick').val();
    });

$('#drop').change(
    function() {
        var val1 = $('#pick option:selected').val();
        var val2 = $('#drop option:selected').val();

        // Do something with val1 and val2 ...
    }
);

Nếu bạn có menu thả xuống đơn giản như:

<select name="status" id="status">
    <option value="1">Active</option>
    <option value="0">Inactive</option>
</select>

Sau đó, bạn có thể sử dụng mã này để nhận giá trị:

$(function(){

 $("#status").change(function(){
     var status = this.value;
     alert(status);
   if(status=="1")
     $("#icon_class, #background_class").hide();// hide multiple sections
  });

});

Thêm hãy thử mã này .. Grt hoạt động của nó .......

<body>
<?php
	if (isset($_POST['nav'])) {
		 header("Location: $_POST[nav]");
	}
?>
<form id="page-changer" action="" method="post">
    <select name="nav">
        <option value="">Go to page...</option>
        <option value="http://css-tricks.com/">CSS-Tricks</option>
        <option value="http://digwp.com/">Digging Into WordPress</option>
        <option value="http://quotesondesign.com/">Quotes on Design</option>
    </select>
    <input type="submit" value="Go" id="submit" />
</form>
</body>
</html>

<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function() {

    $("#submit").hide();

    $("#page-changer select").change(function() {
        window.location = $("#page-changer select option:selected").val();
    })

});
</script>
</head>