javascript - 如何在下拉菜單中獲取跨度文本值

Question

我正在嘗試為下拉菜單實現單擊事件偵聽器。 到目前為止，我沒有太多運氣試圖深入了解其中的值。 這是我正在使用的 html：

<div class="dropdown" data-id="123">
    <div class="arrow">▼</div>
        <span class="value">uk</span>
            <div class="select" tabindex="0" style="display: none; width: 134px;">
                <span data-id="781" class="selected">uk</span>
                <span data-id="782" class>usa</span>
                <span data-id="783">china</span>
                <span data-id="784">africa</span>
            </div>
</div>

如果我點擊下拉菜單中的“非洲”選項，我希望收到顯示“非洲”的警報。 到目前為止，我已經有了這個，但希望獲得更多關於如何實現這一目標的意見：

jQuery('dropdown select').on('mousedown',function(){ alert(jQuery(this).text()); })

謝謝你。

Answer 1

您可以將click事件放在$(".select span")

 $(".select span").on("click",function(){ alert($(this).text()); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="dropdown" data-id="123"> <div class="arrow">▼</div> <span class="value">uk</span> <div class="select"> <span data-id="781" class="selected">uk</span> <span data-id="782" class>usa</span> <span data-id="783">china</span> <span data-id="784">africa</span> </div> </div>

您忘記添加 dot . 在這里上課之前，還需要添加跨度來跟蹤每個跨度

jQuery('.dropdown .select span').on('mousedown',function(){ alert(jQuery(this).text()); })