0

我有这个带有多选块的表单，我试图在点击时获取每个块标准的值，以便我可以将其发送到数据库，但是每次我点击一个块时，我的脚本都会获取所有的值，任何想法?

我在这里创建了一个 jsFiddle：http: //jsfiddle.net/creativestudio/Hqbmk/4/

<form action="" method="post" id="postingFeedback">

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote1" value="A-value1">
                </li>
                <li class="vote" name="vote1" value="A-value2">
                </li>
                <li class="vote" name="vote1" value="A-value3">
                </li>
                <li class="vote" name="vote1" value="A-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->

<div class="clear"></div>

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote2" value="B-value1">
                </li>
                <li class="vote" name="vote2" value="B-value2">
                </li>
                <li class="vote" name="vote2" value="B-value3">
                </li>
                <li class="vote" name="vote2" value="B-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

<div class="clear"></div>

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote3" value="C-value1">
                </li>
                <li class="vote" name="vote3" value="C-value2">
                </li>
                <li class="vote" name="vote3" value="C-value3">
                </li>
                <li class="vote" name="vote3" value="C-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

<div class="clear"></div>

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote3" value="D-value1">
                </li>
                <li class="vote" name="vote3" value="D-value2">
                </li>
                <li class="vote" name="vote3" value="D-value3">
                </li>
                <li class="vote" name="vote3" value="D-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

<div class="clear"></div>

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote4" value="D-value1">
                </li>
                <li class="vote" name="vote4" value="D-value2">
                </li>
                <li class="vote" name="vote4" value="D-value3">
                </li>
                <li class="vote" name="vote4" value="D-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

<div class="clear"></div>

            <!-- .votes-list -->
            <ul class="vote-list">
                   <li class="vote" name="vote5" value="E-value1">
                </li>
                <li class="vote" name="vote5" value="E-value2">
                </li>
                <li class="vote" name="vote5" value="E-value3">
                </li>
                <li class="vote" name="vote5" value="E-value4">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

</form>

这是我的 JS：

function getValues(){    
    $('#postingFeedback li').on('click', function(event){        
           var $clickedValue = $(this).val($(this).attr("value")); // Retreive "value"
           $(this).siblings('input[name="smileVote"]').val($clickedValue); // Plug smile value into input for database POSTS
    });
}



getValues();
​
4

3 回答 3

1

value是一个保留属性，它不打算用于li你想要做的事情。将其重命名为其他名称，例如vote：

<li class="vote" name="vote1" vote="A-value1">

然后通过直接访问属性来获取值：

$('#postingFeedback li').on('click', function(event){
    $(this).siblings('input[name="smileVote"]').val($(this).attr('vote'));
于 2012-10-25T20:47:41.467 回答
0

为每个输入赋予不同的名称。表单以键值对形式发送数据，其中以名称为键。由于所有输入框都具有相同的名称，因此只有一个键值对。

于 2012-10-25T20:39:10.983 回答
0

尝试使用.serializeArray()

$('[type="submit"]').on('click' , function(e) {

    e.preventDefault();

    var  a = $(':input').serializeArray().get();
    console.log(a);
});

您可以使用var a将其发送到您的数据库

检查小提琴

于 2012-10-25T20:44:11.853 回答