避免在jQuery回调中重复选择器

Question

我正在编写一个小脚本，我发现了一些有重复元素的东西。在这种情况下，重复$('#theSelect1 ..')，我想避免它。

$('#theSelect1').change(function(){
        //console.log ($(this));
        console.log(  
        $("#theSelect1 option:selected").text() // is there a way to change #theSelect1 to be $(this) inside this statement?  I try not to repeat things.  
        );
})

这是HTML

            <select id="theSelect1">
            <option value="foo" selected="selected">1</option>
            <option value="bar">2</option>
            <option value="foobar">3</option>

谢谢

Answer 1

您可以执行以下操作：

$(this).children("option:selected").text();

这将查看与您的选择器匹配的当前元素的子元素。这仅查看第一级后代，因此如果需要任何后代，请使用以下内容：

$(this).find("option:selected").text();

Answer 2

你可以这样做：

var selectOne = $('#theSelect1').change(function(){
                     selectOne.find('option:selected').text(); 
                 });