ie8模式下click無(wú)反應(yīng)點(diǎn)擊option無(wú)反應(yīng)的解決方法

更新時(shí)間：2014年10月11日 17:35:55 投稿：whsnow

點(diǎn)擊select里面的option，將其賦值到上面的input，直接用jQuery寫的，問(wèn)題是在用IE8打開(kāi)的時(shí)候，點(diǎn)擊option沒(méi)有任何反應(yīng)

想起了小學(xué)時(shí)候數(shù)不盡的一件小事，哎，那夕陽(yáng)下的奔跑，是我逝去的青春啊。

言歸正傳，先上圖：

<select id="cardNoList" size="4"></select>

實(shí)現(xiàn)的效果比較常見(jiàn)的一種，點(diǎn)擊select里面的option，將其賦值到上面的input，直接用jQuery寫的：

復(fù)制代碼代碼如下:

$("#cardNoList option").click(function(){

$("#card").attr("value","").attr("value",this.value); 

})

有個(gè)奇怪的事情，

由于面向的用戶基本上都是用的360瀏覽器這類國(guó)內(nèi)雙核瀏覽器，加了

本機(jī)Eclipse跑是用的chrome內(nèi)核進(jìn)行解析，放到測(cè)試環(huán)境，就變成ie8標(biāo)準(zhǔn)進(jìn)行解析了。

現(xiàn)在問(wèn)題來(lái)了，學(xué)挖掘……額，不是！

在用IE8打開(kāi)的時(shí)候，點(diǎn)擊option沒(méi)有任何反應(yīng)。

加alert試了下：

復(fù)制代碼代碼如下:

$("#cardNoList option").click(function(){

alert("111");

$("#card").attr("value","").attr("value",this.value);

alert("222"); 

})

click完全沒(méi)有調(diào)用到。

一開(kāi)始以為是jQuery的click事件在ie8下的兼容問(wèn)題，但jQuery對(duì)兼容都封裝解決了，應(yīng)用如此廣，按理不會(huì)就我碰到。

后來(lái)想到，可能是在ie8下click根本沒(méi)有加到option上面去，改了改，將click加到select上，成了，ie8、Firefox、chrome都可以順利賦值到input里。

復(fù)制代碼代碼如下:

$("#cardNoList").click(function(){

$("#card").attr("value","").attr("value",this.value);

})

百度了下，貌似“眾所周知,在IE里, select的option是不支持onclick事件的”　o(╯□╰)o　

經(jīng)提醒，改為：

復(fù)制代碼代碼如下:

$("#cardNoList").click(function(){

$("#card").val(this.value);

})

您可能感興趣的文章:

ie8
click

相關(guān)文章

jQuery實(shí)現(xiàn)兩個(gè)select控件的互移操作
本文主要介紹了利用jQuery實(shí)現(xiàn)兩個(gè)<select>控件的互移操作的方法代碼，具有很好的參考價(jià)值，需要的朋友一起來(lái)看下吧
2016-12-12
jquery選擇器的選擇使用及性能介紹
從這一講開(kāi)始，我們將直正接觸一個(gè)JQ類庫(kù)，學(xué)習(xí)一下JQ的寫法，JQ的一些常用的命令等等，今天主要講的是JQ里的選擇器，這也是JQ的一大特點(diǎn)，這從它的名稱jQuery中可以看到，主要功力體現(xiàn)在查詢上
2013-01-01
jquery 之 $().hover(func1, funct2)使用方法
.hover(func1, func2) 的效果等效于： mouseenter(), mouseleave()
2012-06-06
jQuery事件綁定方法學(xué)習(xí)總結(jié)(推薦)
下面小編就為大家?guī)?lái)一篇jQuery事件綁定方法學(xué)習(xí)總結(jié)(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-11-11
淺析jQuery1.8的幾個(gè)小變化
這篇文章主要介紹了jQuery1.8中的幾個(gè)小變化。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-12-12
jQuery實(shí)現(xiàn)簡(jiǎn)單彈幕制作
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單彈幕制作，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-12-12
jquery+css實(shí)現(xiàn)側(cè)邊導(dǎo)航欄效果
這篇文章主要為大家詳細(xì)介紹了jquery+css實(shí)現(xiàn)側(cè)邊導(dǎo)航欄效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-06-06
內(nèi)容滑動(dòng)切換效果jquery.hwSlide.js插件封裝
這篇文章主要為大家詳細(xì)介紹了jQuery開(kāi)發(fā)之內(nèi)容滑動(dòng)切換效果的相關(guān)資料，jquery.hwSlide.js插件進(jìn)行封裝具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-07-07
jquery插件corner實(shí)現(xiàn)圓角邊框的方法
這篇文章主要介紹了jquery插件corner實(shí)現(xiàn)圓角邊框的方法,實(shí)例分析了jQuery插件corner的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
jquery性能優(yōu)化高級(jí)技巧
jquery性能優(yōu)化做好，速度也很快，那么如何提高jquery性能呢，本篇文章給大家介紹jquery性能優(yōu)化高級(jí)技巧，需要的朋友可以參考下
2015-08-08