如果选择框选项具有值，则禁用禁用的属性

Question

I have a submit button that's disabled by default and has a grayed out image in the src attribute.

Here's the 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>

By default, the user must select the country. When a country is selected that has a value, I'd like to update the image and remove the disabled attribute as long as the value of the dropdown option isn't blank.

Here's the jQuery I've come up with so far but it needs to toggle the disabled attribute based on the value of the select item_location select box.

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");     
        });
    });
}

Answer 1

You can do this:

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

This will disable the submit , in case the item_location value is empty, else enabled.

UPDATE

// 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';
});

Answer 2

use .val() to get selected value of drop-down list

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

or better use .prop()

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

Read .prop() vs .attr()

---

Updated after OP's comment

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

Answer 3

Try this.

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"); 
    }

})