Question

我在选择标签onChange events上遇到问题。我从select标签中选择值，值将显示在文本框中，该文件框在脚本中声明。当我从select标签中删除class =“input”但我不想删除class =“input”时，它工作得很好。请帮助我。

HTML

<select class="input" name="month" class="style4">
   <option> Product  </option>
   <option> Product1 </option>
   <option> Product2 </option>
   <option> Product3 </option>
   <option> Product4 </option>
</select>

<input type="text" name="No_Inst" id="No_Inst"  >

的CSS

.input {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    border: 1px solid #999;
    border-radius: 5px;
    padding: 10px 12px;
    background: #fff;
    font-size: 14px;
    color: #000;
    box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    outline: none;
    margin-bottom: 25px
}

JS

$(document).ready(function(){    
$('.style4').change(function(){
  var a = $(this).val();

   if(a == 'Product'){
        $('#No_Inst').val('')
    }

    if(a == 'Product1'){
        $('#No_Inst').val(50)
    }

     if(a == 'Product2'){
        $('#No_Inst').val(100)
    }
});
});

Answer 1

您无法在单个元素上多次定义属性，当发生这种情况时，第一个属性会覆盖后续属性。这可以在HTML5 spec, 8.2.4.35 Attribute name state

中提及

如果令牌上已经存在具有完全相同名称的属性，那么这是一个解析错误，必须从令牌中删除新属性。

您需要设置单个类属性。

<select class="input style4" name="month">

而不是

<select class="input" name="month" class="style4">

Answer 2

您不能在代码中使用2 class个属性，但可以这样做：

<select name="month" class="input style4">

您的<option>集中也没有值，为此您可以执行以下操作：

<option value="My value">Hello</option>

Answer 3

更改您的输入＆＃39;上课简单＆＃39;选择＆＃39; - 样式将应用于选择DOM元素并删除＆＃39; .input＆＃39;您的选择标记中的类

选择标记onchange事件问题

3 个答案: