如果选择框选项具有值,则切换禁用属性

时间:2013-11-07 13:21:40

标签: javascript jquery html forms

我有一个默认禁用的提交按钮,并且在src属性中有一个灰色的图像。

这是HTML:

<form>
<select id="item_location">
    <option value="">- Choose Destination -</option>
    <option value="US">US</option>
    <option value="CN">Canada</option>
    <option value="IN">International</option>
</select>

<input class="submit" type="image" src="http://website.com/images/btn_buynow_LG--disabled.png" border="0" name="submit" disabled>
</form>

默认情况下,用户必须选择国家/地区。当选择具有值的国家/地区时,只要下拉选项的值不为空,我就会更新图像并删除已禁用的属性。

这是我到目前为止提出的jQuery,但它需要根据select item_location选择框的值来切换disabled属性。

function submitButton() {
    jQuery(".submit").change(function() {
        if (jQuery("#item_location") !== "" {
            jQuery(".submit").attr("src", "http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif").removeAttr("disabled");     
        });
    });
}

3 个答案:

答案 0 :(得分:1)

你可以这样做:

jQuery(".submit").prop("disabled", jQuery("#item_location").val() === "")

如果submit值为空,则会禁用item_location,否则启用。

<强>更新

// Cache the submit button
var $submit = jQuery(".submit");

// Disable the button based on the dropdown value
$submit.prop("disabled", jQuery("#item_location").val() === "");

// Change the src image, based on disabled attribute of submit button
$submit.prop("src", function (i, val) {
    return $submit.prop("disabled") ? 'old_image_src' : 'new_image_src';
});

答案 1 :(得分:0)

使用.val()获取下拉列表的选定值

if (jQuery("#item_location").val() !== "") {
                             ^           ^ //added ) here

或更好地使用.prop()

jQuery(".submit").prop("disabled", jQuery("#item_location").val() === "")

阅读.prop() vs .attr()

<小时/> 在OP的评论

之后更新
jQuery(".submit").prop("src", "http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif");

答案 2 :(得分:0)

试试这个。

jQuery("#item_location").change(function() {
    if (this.value) {
        jQuery(".submit").prop("src", "http://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif").removeAttr("disabled"); 
    }

})