Question

我需要获取所选项目的标记中的文本值，以便在AJAX请求中使用。例如：

<label for="item1">Item Number One</label>
<select name="item1" id="item1" class="lookup">
  <option value="">Please Select</option>
  <option value="1">Option 1</option>
  <option value="2">Option 2</option>
</select>

我想检索文字＆＃34; Item Number One＆＃34;。这是我到目前为止使用的jQuery代码，用于获取ID和所选值并通过AJAX发布：

$(function() {
    $(".lookup").change(function() {
    var id = $(this).attr('id'));
        var selection=$(this).val();
        var dataString = 'field=' + id + '&selection=' + selection + '&crudtype=datecheck';
        $.ajax( {
            type: "POST",
            url: "/admin/processes/steps/autogens/crud",
            data: dataString,
            cache: false,
            success: function(html) {
                $("#" + id + "_date").html(html);
            } 
        });
    });
});

Answer 1

如果我正确阅读您的问题，您需要所选项目/选项的文字：

var selectedOptionText = $('#item1').find(':selected').text();

要在您的代码中执行此操作：

$(function() {
    $(".lookup").change(function() {
    var id = $(this).attr('id'));
        var selection=$(this).val();
        var selectionText = $(this).find(':selected').text(); //This is the newline.
        var dataString = 'field=' + id + '&selection=' + selection + '&crudtype=datecheck';
        $.ajax( {
            type: "POST",
            url: "/admin/processes/steps/autogens/crud",
            data: dataString,
            cache: false,
            success: function(html) {
                $("#" + id + "_date").html(html);
            } 
        });
    });
});

Answer 2

为什么不能只使用标签的for属性来识别它？

因此，使用您的示例，您的jQuery选择器将是：

var id = $(this).attr('id');
var label = $("label[for='" + id + "']");
var text = label.text();

Answer 3

转到ID - vs - FOR属性搜索：

$(".lookup").change(function() {

    var labelText = $("[for="+this.id+"]").text(); // You have the LABEL's text now
    // other code here...

});

PS：考虑到有一天某人（不是你）可以修改HTML并将LABEL放在任何认为最合适的地方，查找.closest()不是一个好主意（特别是如果它不是父母:)）或使用.prev()，.next()等......

Answer 4

使用DOM遍历从<label>元素获取文本节点，即

var labelText = $(this).prev('label').text();

像这样（并且在第三行的末尾有一个额外的右括号）：

$(function() {
    $(".lookup").change(function() {
        var id = $(this).attr('id'),
            selection = $(this).val(),
            labelText = $(this).prev('label').text(),
            dataString = 'field=' + id + '&selection=' + selection + '&crudtype=datecheck';
        $.ajax( {
            type: "POST",
            url: "/admin/processes/steps/autogens/crud",
            data: dataString,
            cache: false,
            success: function(html) {
                $("#" + id + "_date").html(html);
            } 
        });
    });
});

p / s：您可以使用逗号:)连接var声明

Answer 5

假设标签和选择并不总是直接对等，我会在更改回调中使用

var curName = $(this).attr('name');
var labelText = $('[for='+curName+']').text();

这通常会通过for和name attrs获取与选择相关联的标签的文字。

这仍然不是解决这些问题的最佳方式，您绝不应将DOM视为数据。至少，当您构建选择时，您可以使用data-标记来更快/更好地查找。

有没有办法使用jQuery从选择项中获取标签？

5 个答案: