通过 jquery 访问标签文本

Question

有没有办法使用 jquery 从 <label> 元素中获取文本？因为我们可以使用 $(this).val(); 从中获取值，但无法对标签文本执行相同的操作。

似乎我们应该能够在选择单选按钮时使用 $(this) 查询 <label> 文本，因为 $(this) 在那个时候知道它的值。

最初使用 case 语句并手动填写一些文本，但如果我们能够只插入标签文本，那么就不需要使用所有 case 语句。

thoughts/suggestions?

html

<div class="panel panel-default">
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            <a data-toggle="collapse" data-parent="#accordion" href="#accordion-second">What You Are Interested In Learning About</a>
                        </h4>
                    </div>
                    <div id="accordion-second" class="panel-collapse collapse">
                        <div class="panel-body">
                            <div class="radio">
                                <label><input type="radio" name="optradio2" value="2a">the Automotive Industry</label>
                            </div>
                            <div class="radio">
                                <label><input type="radio" name="optradio2" value="2b">the sports industry</label>
                            </div>
                            <div class="radio">
                                <label><input type="radio" name="optradio2" value="2c">the music industry</label>
                            </div>
                        </div>
                    </div>
                </div>

jquery

<script>
    $('[name="optradio2"]').on('change', function () {
        $('#accordion-third').slideToggle();
        $('#accordion-second').slideToggle();

        //how do you get the label text 
        var labelText = $("label", this).text();

        //current method but would prefer to just insert the label text
        /*var value = $(this).val();
        switch (value) {
            case "2a":
                $('#blank2', $('#myModal')).text('the automotive industry');
                break;
            case "2b":
                $('#blank2', $('#myModal')).text('the sports industry');
                break;
            case "2c":
                $('#blank2', $('#myModal')).text('the music industry');
                break;
            default:
                alert("oops! something went wrong");
        }*/
})
</script>

Answer 1

上下文选择器使用 find 并搜索后代。

label不是input的child，是反的，所以要找parents，而且closest貌似合适

var labelText = $(this).closest("label").text();

Answer 2

您可以使用 HTMLInputElement.labels 属性访问相关 <label>，其中 returns 与特定 [=] 关联的 <label> 元素的节点列表14=]，使用数组索引符号获取（通常）第一个：

this.labels[0].textContent;

参考文献：

HTMLInputElement.

通过 jquery 访问标签文本

Accessing label text via jquery

jquery

html

asp.net-mvc

forms

radio-button