Question

我正在努力让这行代码正常工作。

$(".selectnumber").text($(this).parent().find('select').children(':selected').text());

它只想获取select的文本值并将其放入selectnumber span。

alert($(".selectnumber").parent().find('select').children(':selected').text());

工作正常并返回正确的值，所以我必须假设$（this）没有像我期望的那样引用.selectnumber span。

如果它影响了任何事情，那么继续使用HTML，但我认为它不会。

<div class="holder">
    <span class="selectnumber"></span>
    <select id="number_of_cards_required" name="number_of_cards_required">
        <option selected="selected">1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
</select>
</div>

Answer 1

我必须假设$（this）没有像我期望的那样引用.selectnumber span。

是的，这是正确的。您期望this引用您选择的元素，这只是因为您正在调用它们上的函数。但是，你只是将一个参数传递给一个函数，此时它与你调用函数的对象没有关系，所以这没有多大意义。

但是，您可以将函数传递给.text() jQuery方法，允许您使用this来引用该特定匹配元素。

$(".selectnumber").text(function () {
    return $(this).parent().find('select').children(':selected').text()
});

Answer 2

使用

$(".selectnumber").html( your text )

不是

$(".selectnumber").text( your text )

Answer 3

this必须在有意义的上下文中使用，作为触发器。您可以尝试以下方式：

$(".selectnumber").html($("#number_of_cards_required").val());

修改

如果您为选项添加value但仍需要文本，则可以使用：

$('#number_of_cards_required option:selected').text()

Answer 4

您需要使用.html()代替text()。也许您还希望每次选择更改时都更新范围：

    $(".selectnumber").html($('#number_of_cards_required').val());


       $('#number_of_cards_required').change(function(){
    $(".selectnumber").html($('#number_of_cards_required').val());
});

看看这个jsfiddle

Answer 5

$(function() {

//initial loading
$(".selectnumber").text($(".selectnumber").parent().find('select').children(':selected').text());  

//changing span if select changes

$("select").change(function() {
$(".selectnumber").text($(this).parent().find('select').children(':selected').text());        
    })
})

http://jsfiddle.net/ACf4Y/

Jquery可能我误解了这个选择器

5 个答案: