Question

显示Jquery UI的JDatePicker时出现问题。我想在Combobox中有onchange事件时显示不同的格式。这是我的代码，当第二次onchange事件被触发时它不起作用。

Javascript代码

$(document).ready(function() {
    $("tr.golf_name").hide();
    $("tr.location").hide();

    $('input.type').click(function(event){
        var selectVal = $(this).val();

        if(selectVal == "tournament") {
            $("tr.golf_name").show();
            $("tr.location").show();
        } else {
            $("tr.golf_name").hide();
            $("tr.location").hide();
        }
    });

    $('#price_type').change(function(){
        var selectedVal = $(this).val();
        if(selectedVal != "none") {
            $('#golf_name').attr("disabled", false);
            $('#location').attr("disabled", false);

            $('#startdate').attr("disabled", false);
            $('#enddate').attr("disabled", false);
            $('#start_time1').attr("disabled", false);
            $('#start_time2').attr("disabled", false);
            $('#end_time1').attr("disabled", false);
            $('#end_time2').attr("disabled", false);
            $('#details').attr("disabled", false);
            $('#submit').attr("disabled", false);

            if($("option:selected",this).text() == "weekday") {
                // Holiday List
                var unavailableDates = ["9-3-2012", "14-3-2012", "15-3-2012"];
                // Exeptions if some Weekends are Working days
                var enableDay = ["3-3-2012", "10-3-2012", "17-3-2012"];
                // Weekend Days Sunday = 0 ... Sat =6
                var weekend = [0, 6];
                function nationalDays(date) {
                    // get date
                    dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();


                    // if Holiday then block it    
                    if ($.inArray(dmy, unavailableDates) > -1) {
                        return [false, "", "Unavailable"];

                    }
                    // if Exception then Enable it
                    if ($.inArray(dmy, enableDay) > -1) {
                        return [true, ""];

                    }

                    //if Weekend then block it
                    if ($.inArray(date.getDay(), weekend) > -1) {
                        return [false, "", "Unavailable"];
                    }

                    return [true, ""];
                }

                $(function() {
                    $("#startdate").datepicker({
                        dateFormat: 'dd MM yy',
                        beforeShowDay: nationalDays
                    });
                });
            } else {
                var weekday = [1,2,3,4,5];
                function weekDays(date) {
                    // get date
                    dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();

                    //if Weekend then block it
                    if ($.inArray(date.getDay(), weekday) > -1) {
                        return [false, "", "Unavailable"];
                    }

                    return [true, ""];
                }

                $(function() {
                    $("#startdate").datepicker({
                        dateFormat: 'dd MM yy',
                        beforeShowDay: weekDays
                    });
                });
            }
        } else {
            $('#golf_name').attr("disabled", true);
            $('#location').attr("disabled", true);

            $('#startdate').attr("disabled", true);
            $('#startdate').attr("disabled", true);
            $('#enddate').attr("disabled", true);
            $('#start_time1').attr("disabled", true);
            $('#start_time2').attr("disabled", true);
            $('#end_time1').attr("disabled", true);
            $('#end_time2').attr("disabled", true);
            $('#details').attr("disabled", true);
            $('#submit').attr("disabled", true);
        }
    });
});

这是我的HTML代码。

<tr height=22>
          <td align=right>Select Price</td>
          <td>: 
                <select name="price_type" id="price_type">
                    <option value="none">Select Price Type</option>
                    <option value="2">tournament</option>
                    <option value="3">weekday</option>
                </select>
          </td>
        </tr>
        <tr><td bgcolor=d9d9d9 width=800 height=1 colspan=2></td></tr>

<tr height=22>
          <td align=right>Start Date</td>
          <td>: 
                <input type="text"  name="startdate" id="startdate" disabled /> (yyyy/mm/dd)
          </td>
        </tr>
        <tr><td bgcolor=d9d9d9 width=800 height=1 colspan=2></td></tr>

您可以在此Fiddle

中查看

如何处理？谢谢。

Answer 1

您应该使用.prop()来设置禁用状态，而不是像{/ 3}那样设置

$('#startdate').prop("disabled", true);

阅读：.attr()

演示：prop vs attr

Answer 2

我认为这里的问题var selectedVal = $（this）.val（）;因为你的Combobox是父母，所以你需要得到它的selectedItem。

Onchange Combobox事件不起作用

2 个答案: