jQuery 点击option 更改select 的name属性(解决谷歌Chrome onclick事件失效问题)

需求:点击不同的选项向后台提交的name也随之改变(1,2选项 name="state" ;3选项name="state2")

一个简单的select标签

<select style="width: 165px;" name="state" id="state">
<option value="">-请选择-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
...
</select>

 

IE浏览器中

• 添加onclick事件

• <option value="1" onclick="changeSelectName('state2')">1</option>

   

• 书写js方法

• function changeSelectName(value) {
  		$("#state").attr("name", value)
  	}

   

 

select的option标签中 onclick事件在Chrome中失效问题,此时就不可以在option上写事件了

• 在select上添加onchonchange事件

<select style="width: 165px;" name="state" id="state" onchange="changeSelectNameByChrome(this.selectedIndex);">
<option value="">-请选择-</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

• js方法

• function changeSelectNameByChrome(i) {
  		if (i < 3)
  			$("#BKBJState").attr("name", "state")
  		else
  			$("#BKBJState").attr("name", "classify")
  	}