javascript - 使用jquery获取textarea的值很困难

Question

我有以下内容:

<div class="tab-pane" id="message">
    <textarea rows="4" cols="50" id="send_message" placeholder="Enter text ...">  </textarea>
    <a href="#message" class="btn btn-large btn-info"  data-toggle="tab">OK</a>
    <a href="#message" class="btn btn-large btn-info"  data-toggle="tab">Cancel</a>

当我添加时:

if($(this).is(":contains(Cancel)"))  {

    var text= $("#send_message").val();

    log.console(text)

我得到了正确的值

如果我将行更改为:

    var text= $(this).find("#send_message").val();

我得到未定义的日志记录到控制台。这是为什么？

这是完整的 jQuery 函数:

$(function(){
    $('#message').on("click", "a", function(){

        if( $(this).is(":contains(OK)") ) {

            console.log("im in OK!!");
        }
        else if( $(this).is(":contains(Cancel)") )  {

        //  var text= $("#send_message").val();
            var text= $(this).find("#send_message").val();
            console.log(text);
            console.log("im in cancel!!");
        }
    });
});

Answer 1

这里的问题是 .find() 获取每个元素的后代

<b>Description:</b> Get the descendants of each element in the current set of matched
elements, filtered by a selector, jQuery object, or element.

这意味着您正在单击 <a>即 <textarea> 之后在 DOM 中，所以 .find()不会向后查找。

无论如何，要找到具有 ID 的元素，您只需 $("#send_message") ，和.val()来获取它的值。

演示 here