0

我有这个带有多选块的表单，我试图在单击时获取每个块的值，以便将其发送到数据库，但是每次单击块时，我的脚本都会获取所有值，有什么想法吗？

我在这里有一个 jsFiddle：http: //jsfiddle.net/creativestudio/Hqbmk/1/

这是我的html：

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

            <!-- .votes-list -->
            <ul class="vote-list">
                <li class="vote" name="vote1" value="0">
                </li>
                <li class="vote" nname="vote1" value="1">
                </li>
                <li class="vote" name="vote1" value="2">
                </li>
                <li class="vote" name="vote1" value="3">
                </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="0">
                </li>
                <li class="vote" nname="vote2" value="1">
                </li>
                <li class="vote" name="vote2" value="2">
                </li>
                <li class="vote" name="vote2" value="3">
                </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="3">
                </li>
                <li class="vote" nname="vote3" value="2">
                </li>
                <li class="vote" name="vote3" value="1">
                </li>
                <li class="vote" name="vote3" value="0">
                </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="0">
                </li>
                <li class="vote" nname="vote4" value="1">
                </li>
                <li class="vote" name="vote4" value="2">
                </li>
                <li class="vote" name="vote4" value="3">
                </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="0">
                </li>
                <li class="vote" nname="vote5" value="1">
                </li>
                <li class="vote" name="vote5" value="2">
                </li>
                <li class="vote" name="vote5" value="3">
                </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="vote6" value="0">
                </li>
                <li class="vote" nname="vote6" value="1">
                </li>
                <li class="vote" name="vote6" value="2">
                </li>
                <li class="vote" name="vote6" value="3">
                </li>
                <input name="smileVote" class="is-hidden" data-role="none" value="" />
            </ul><!-- / .votes-list -->
            <div class="clear"></div>

 <button class="" type="submit" >Send</button>

</form>

这是我的jQuery：

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



getValues();
​

我将不胜感激。

4

3 回答 3

1

您需要获取li's 的同级输入，因此它不会为所有输入设置值

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

此外，要发布每个输入值，您需要为输入元素使用不同的名称

http://jsfiddle.net/wirey00/Hqbmk/2/

于 2012-10-25T19:31:39.947 回答
0

问题是每个都有相同的名称：“smileVote”

每个都应该有不同的名称。

于 2012-10-25T19:28:42.803 回答
0 
function getValues(){    
    $('#postingFeedback .vote-list li').on('click', function(event){         
           var $clickedValue = $(this).val(); // Retreive "value"            
           $(this).parent().find('input[name="smileVote"]').val($clickedValue); // Plug smile value into input for database POSTS
    });
}



getValues();

这应该会有所帮助。

于 2012-10-25T19:32:30.790 回答