Question

我有一个多选块的这个表单，我试图获取每个块的值，因此我可以发送它一个数据库，但每次我点击一个块我的脚本获得所有的值，任何想法？

我在这里有一个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();

我将不胜感激。

Answer 1

您需要获取li的兄弟输入，以便它不会为所有输入设置值

$('#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/

Answer 2

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

每个人都应该有不同的名字。

Answer 3

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();

这应该有所帮助。

如何使用Jquery从多选标准中获取输入值

3 个答案: