第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

如何通過 vanialla JavaScript 獲取所選選項的數(shù)據(jù)屬性？

如何通過 vanialla JavaScript 獲取所選選項的數(shù)據(jù)屬性？

溫溫醬 2022-05-22 16:00:23
我正在嘗試使用 vanilla JavaScript 獲取所選選項的數(shù)據(jù)屬性。<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script><select id="roomno" name="roomno">    <option value="1" data-daily-rate="50" data-weekly-rate="300" data-monthly-rate="1200">1 - Single room</option>    <option value="2" data-daily-rate="100" data-weekly-rate="600" data-monthly-rate="2500">2 - Double Bedroom</option>    <option value="3" data-daily-rate="150" data-weekly-rate="850" data-monthly-rate="4000">3 - Deluxe</option>    </select><script>document.addEventListener("DOMContentLoaded", () =>{    $("#roomno").on("change", function() // Used jQuery only for this    {             calculateRate();    });});function calculateRate(){    let roomno = document.getElementById("roomno");    let daily_rate = roomno.dataset['daily-rate'];    console.log(daily_rate);}</script>
查看完整描述

1 回答

?
翻閱古今

TA貢獻(xiàn)1780條經(jīng)驗 獲得超5個贊

要獲得選定的選項，您可以使用：


var roomno = e.options[e.selectedIndex];

要獲取所選選項的數(shù)據(jù)集值，您可以使用


 roomno.dataset.dailyRate

 // Or,

 roomno.dataset['dailyRate']

此外，您還可以訪問其他數(shù)據(jù)屬性，例如：


 roomno.dataset.dailyRate

 roomno.dataset.weeklyRate

 roomno.dataset.monthlyRate

此外，您不需要僅為此使用 jQuery $("#roomno").on("change", function()：. 您可以附加change事件偵聽器，例如：


 document.getElementById("roomno").addEventListener("change", calculateRate);

在這里演示：


document.addEventListener("DOMContentLoaded", () => {

  document.getElementById("roomno").addEventListener("change", calculateRate);

});


function calculateRate() {

  let e = document.getElementById("roomno");

  var roomno = e.options[e.selectedIndex];

  let daily_rate = roomno.dataset.dailyRate;

  console.log(daily_rate);

}

<select id="roomno" name="roomno">

  <option value="0" >-- Select --</option>

  <option value="1" data-daily-rate="50" data-weekly-rate="300" data-monthly-rate="1200">1 - Single room</option>

  <option value="2" data-daily-rate="100" data-weekly-rate="600" data-monthly-rate="2500">2 - Double Bedroom</option>

  <option value="3" data-daily-rate="150" data-weekly-rate="850" data-monthly-rate="4000">3 - Deluxe</option>

</select>


查看完整回答
反對 回復(fù) 2022-05-22
  • 1 回答
  • 0 關(guān)注
  • 124 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號