javascript - JQuery function when onchange of select box value add attr disabled to input[text], -

i'm going make select option , input textbox take values , collect numbers.

all need - if select value select box text box should disabled. opposite should happen when type on text box - select box should disabled.

here did:

<select id="subject_items" name="subjectitems">     <option value="none">select</option>     <option value="1-10">1-10</option>     <option value="11-20">11-20</option>     <option value="20-50">20-50</option>     <option value="50+">50+</option> </select> <input type="text" name="txtsubitems" id="txtsubitems" placeholder="or type exact number"/>    <h4 id="showquote" class="formh4 text-center"></h4>   <script>    function multiplyvals(multinum, firstnum, secondnum, addphotonum){    var multinum, multinum, secondnum, addphotonum;    var multifirst = multinum*firstnum + addphotonum*5 +30;    var multisecond = multinum*secondnum + addphotonum*5 +30;    return "from "+ " $"+multifirst +" "+ " $"+multisecond;  }                function multiplyvals50(multinum, firstnum, addphoto){     var multinum, multinum, addphoto;     var multifirst = multinum*firstnum + addphoto*5 +30;     return " $"+multifirst+"+";   } function multiplyvalstxt(multinum, firstnum, addphoto){     var multinum, multinum, addphoto;     var multifirst = multinum*firstnum + addphoto*5 +30;     return " $"+multifirst;   }  function displayvals() {      var numofitem = $("#subject_items").val();      var numofitemsingle = $("#txtsubitems").val();      var addphoto = $("#add_photo").val();      var $towval = $('#subject_items'),  $oneval = $('#txtsubitems');        if(numofitem == '1-10'){                 $("#showquote").html( multiplyvals(16, 1, 10, addphoto));                 $oneval.attr('disabled', 'disabled').val('');                 }       else if(numofitem == '11-20'){                 $("#showquote").html( multiplyvals(12, 11, 20, addphoto));                   }       else if(numofitem == '20-50'){                 $("#showquote").html( multiplyvals(9, 20, 50, addphoto));                    }       else if(numofitem == '50+'){                 $("#showquote").html(multiplyvals50(7, 50, addphoto));                   }       else if(numofitemsingle <=10){                 $("#showquote").html(multiplyvalstxt(16, numofitemsingle, addphoto));                 }       else if(numofitemsingle <20){                 $("#showquote").html(multiplyvalstxt(12, numofitemsingle, addphoto));                 }       else if(numofitemsingle <50){                 $("#showquote").html(multiplyvalstxt(9, numofitemsingle, addphoto));                 }       else if(numofitemsingle >50){                 $("#showquote").html(multiplyvalstxt(7, numofitemsingle, addphoto));                 }       else {                                     $("#showquote").html("<p>please choose number of subject items </p>");\                 $oneval.removeattr('disabled');            }            }//end displayvals function    $("select#subject_items").change(displayvals);             var qqqq = window.setinterval( function(){             displayvals()},10             );  </script> 

better attach event handler using .on()

attach event handler function 1 or more events selected elements.

(1) on changing select, disable textbox

$('#subject_items').on('change', function(){  $('#txtsubitems').attr("disabled", "disabled");  }); 

similarly

(2) on changing input, disable select

$('#txtsubitems').on('change', function(){      $('#subject_items').attr("disabled", "disabled");      }); 

i can't check site, rather here fiddle

updates:

from comments,

    $('#subject_items').on('change', function () {     console.log($(this).val());     if ($(this).val() !== 'none') {         $('#txtsubitems').prop("disabled", true);     } else {         $('#txtsubitems').prop("disabled", false);     } });  $('#txtsubitems').on('change', function () {     if ($(this).val() !== '') {         $('#subject_items').prop("disabled", true);     } else {         $('#subject_items').prop("disabled", false);     } }); 

updated fiddle

hope understand.