jQuery没有接收输入元素的值

时间:2013-04-29 12:13:14

标签: jquery forms

我有一个用户列表,每个用户都有一个小表单,管理员可以在其中添加自己的评论。像这样:

<form name="update_comment_99" method="post" action="">
    <td colspan="4">
        <input type="text" name="sortering" id="sortering" placeholder="job" value="">
    </td>
    <td colspan="3">
        <textarea name="comment" id="comment" placeholder="Comment"></textarea>
    </td>
    <td>
        <input type="hidden" value="99" name="uid" id="uid">
        <a name="comment_button" id="comment_button" class="btn btn-primary pull-right  comment-button">Update 
            <li class="icon-circle-arrow-up icon-white"></i>
        </a>
</form>
    </td>

然后我有一个与按钮一起使用的事件处理程序:

$('#cvDatabase').on('click', '.comment-button', function() {
    var uid = $('input[name=uid]');
    var comment = $('textarea[name=comment]');
    var sortering = $('input[name=sortering]');
    var dataString = 'uid='+uid.val()+'&comment='+comment.val()+'&sortering='+sortering.val();
    alert(dataString);

我遇到的问题是jQuery没有获得表单元素的用户输入,只有在预先填充“value =”时才会输入。

我已经做过无数次没有问题,但由于某种原因,这根本不起作用!

6 个答案:

答案 0 :(得分:2)

你需要这样做:

var $tr = $(this).closest('tr');
var uid = $tr.find('input[name=uid]');
var comment = $tr.find('textarea[name=comment]');
var sortering = $tr.find('input[name=sortering]');

var dataString = 'uid=' + uid.val() + '&comment=' + comment.val() + '&sortering=' + sortering.val();
alert(dataString);

使用$('input[name=uid]')为您提供第一个输入的对象,而不是您当前点击的comment按钮附近的元素。

答案 1 :(得分:1)

尝试这样http://jsfiddle.net/Lwh4C/1/

 $(document).on('click', '.comment-button',function(){
            var uid = $('input[name=uid]');
            var comment = $('textarea[name=comment]');
            var sortering = $('input[name=sortering]');
            var dataString = 'uid='+uid.val()+'&comment='+comment.val()+'&sortering='+sortering.val();
            alert(dataString);
    });

答案 2 :(得分:0)

请参阅

http://jsfiddle.net/2dJAN/5/

$('#comment_button').on('click', function() {
        var uid = $('input[type=hidden]').attr('id');
        var comment = $('textarea[name=comment]').val();
        var sortering = $('input[name=sortering]').val();
        var dataString='uid='+uid+'&comment='+comment+'&sortering='+sortering
        alert(dataString);
});

答案 3 :(得分:0)

试试这个

$('.comment-button').live('click',function() {
        var uid = $('#uid');
        var comment = $('#comment');
        var sortering = $('#sortering');
        var dataString = 'uid='+uid.val()+' &comment='+comment.val()+' &sortering='+sortering.val();
        alert(dataString);
});

答案 4 :(得分:0)

jsfiddle for that

 $("#comment_button").click(function() {
   var uid = $("#uid").val()
    var comment = $("#comment").val()
    var sortering = $("#sortering").val()
    var dataString = 'uid='+uid+'&sortering='+sortering+'&comment='+comment;
    alert(dataString);
 });

答案 5 :(得分:0)

让我们按照一般方式进行操作,如果需要,不要担心新添加的输入元素,它会生成dataString,但仍然非常强大的javascript + jQuery。

<form name="update_comment_99" method="post" action="">
    <td colspan="4">
        <input type="text" name="sortering" id="sortering" placeholder="Type of job" value="" />
    </td>
    <td colspan="3">
        <textarea name="comment" id="comment" placeholder="Comment"></textarea>
    </td>
    <td>
        <input type="hidden" value="99" name="uid" id="uid"/>
        <a id="comment_button" href="#">Update <i class="icon-circle-arrow-up icon-white"></i></a>
    </td>
</form>
<script>
$("#comment_button").on('click', function(){
    var dataString=$('form[name=update_comment_99]').find('input,textarea').map(
        function(){return this.name+"="+this.value;}
    ).splice(0).join('&');
    alert(dataString);
    //for multiple selects this may not work so simple, but thats not your question
});
</script>

http://jsfiddle.net/36aS9/

来摆弄