jQuery选择正确的文本区域

jQuery selecting the right textarea

本文关键字:文本 区域 选择 jQuery      更新时间:2023-09-26

我在选择textarea的值时遇到了一点问题。这是我的HTML:

<tr>
    <td>
        <textarea name="notes" id="3"></textarea>
    </td>
    <td>
        <span class="notesbtn" id="3">save</span>
    </td>
</tr>

我的jQuery代码,在那里我试图正确的textarea与id(相同)的射击span-button:

$(document).ready(function(){
    $('.notesbtn').click(function(){
        var jid = $(this).attr('id');
        var uid = <? echo $user_info['id'];?>;
        var txt = $('textarea#'+jid).val(); 
        $.ajax({
            type: "POST",
            url: "/ajax/save_anote.php", 
            data: {
                jid: jid,     
                uid: uid,     
                txt: txt
            }, 
            success: function(msg) {
                // window.location.reload();
            }
        })
    }); 

但是我没有得到textarea的值。我错在哪里?

不要使用以数字开头的标识符。

不要使用相同的标识符两次。它们应该是独一无二的。

:

<tr>
    <td>
        <textarea name="notes" id="textarea-3"></textarea>
    </td>
    <td><span class="notesbtn" data-id="3">save</span>
    </td>
</tr>

JS :

$('.notesbtn').click(function () {
    var jid = $(this).data('id');
    var uid = <? echo $user_info['id']; ?>;
    var txt = $('#textarea-' + jid).val();
    $.ajax({
        type: "POST",
        url: "/ajax/save_anote.php",
        data: {
            jid: jid,
            uid: uid,
            txt: txt
        },
        success: function (msg) {
            // window.location.reload();
        }
    });
});

下面是一个演示:http://jsfiddle.net/L6ZRr/1/

我认为你不能设置id只有数字。试试这个

<tr><td><textarea name="notes" id="a3"></textarea></td><td><span class="notesbtn" rel="3">save</span></td></tr>
$(document).ready(function(){
    $('.notesbtn').click(function(){
        var jid = $(this).attr('rel');
        var uid = <? echo $user_info['id'];?>;
        var txt = $('textarea#a'+jid).val(); 
        $.ajax({
            type: "POST",
            url: "/ajax/save_anote.php", 
            data: {jid,uid,txt}, 
             success: function(msg) {
                     //window.location.reload();
            }
        })
    }); 

嗨,我已经通过你的代码,你使用相同的id,但id应该是唯一的。总之,我已经创建了一个例子,使用您的代码..

javascript代码:

$(document).ready(function(){ 
    $('.notesbtn').click(function(){
        var jid = $(this).attr('id'); 
        var txt = $('textarea#'+jid).val(); 
        alert(txt); 
    }); 
});

参见工作示例:-http://jsfiddle.net/daL6s/19/

正如其他答案正确指出的:首先,id应该是唯一的和次要的,避免id从数字开始。另外,您的问题的典型方法是通过data-属性提供用户数据,因此html将是:

<tr>
    <td>
        <textarea name="notes" id="textarea3"></textarea>
    </td>
    <td>
        <span class="notesbtn" data-textarea="#textarea3">save</span>
    </td>
</tr>

和JavaScript:

// var jid = $(this).attr('id');
var txt = $($(this).data('textarea')).val();

详情请参阅jQuery文档

id必须唯一

将你的代码重写为:

<tr>
    <td>
        <textarea name="notes" id="textarea3"></textarea>
    </td>
    <td>
        <span class="notesbtn" id="3">save</span>
    </td>
</tr>

当你像

那样检索它时
var txt = $('textarea#'+jid).val();