如何在選項元素點擊或Chrome，Safari和Opera中的解決方法中觸發事件

Question

因此，我已經做了一些研究，並知道Chrome，Opera和Safari不會像FF和IE一樣點擊選項點擊事件。我已經閱讀了一些建議，以便使用變更來實現我想要的結果，但無法使用onchange使其工作。爲了簡單起見，當選擇選項時必須出現新的文本，而當你選擇另一個選項時，新的文本必須出現，而舊的文本必須消失。所以代碼看起來像這樣，並在FF和IE上工作。 HTML部分：

<select required id="topic" name="topic"> 
        <option class="a01" value="1">1</option> 
        <option class="a02" value="2">2</option> 
</select> 

<p style="display:none;" id="a01">text1</p> 
<p style="display:none;" id="a02">text2</p> 

JS部分：

$(document).ready(function() { 

$(".a01").on('click', function() { 

    $("#a02").hide(); 
    $("#a01").show(); 
}); 
$(".a02").on('click', function() { 

    $("#a01").hide(); 
    $("#a02").show(); 
}); 
}); 

Answer 1

你可以在變化和工作具有此值的選擇值。像這樣：

<script> 

$(document).ready(function() { 

    $("#topic").on('change', function() { 

    var selectValue = $(this).val(); 

    if (selectValue == '1') { 
     $("#a02").hide(); 
     $("#a01").show(); 
    } else if (selectValue == '2') { 
     $("#a01").hide(); 
     $("#a02").show(); 
    } 
    }); 
}); 

</script>