我的方法是：

Question

我是jquery的新手，我正在编制一份调查表，我有多个下拉菜单用于不同的问题，但它们都具有相同的下拉值。假设我有：

<select name="Forms[AgentIsPitch]" id="Forms_AgentIsPitch">
 <option value="">Choose One</option>
 <option value="Yes">Yes</option>
 <option value="No">No</option>
 <option value="N/A">N/A</option>
</select>   


<select name="Forms[MandatoryOptIsStated]" id="Forms_MandatoryOptIsStated">
 <option value="">Choose One</option>
 <option value="Yes">Yes</option>
 <option value="No">No</option>
 <option value="N/A">N/A</option>
</select>

以及其他不同内容的不同下拉菜单。计算选择是，否和N / A /？的最佳方法是什么？感谢

Answer 1

通常，您可以使用<!DOCTYPE html> <html lang="en"> <head> <title>Web Hosting | Support</title> <meta charset="utf-8"> <link rel="stylesheet" href="css/reset.css" type="text/css" media="all"> <link rel="stylesheet" href="css/layout.css" type="text/css" media="all"> <link rel="stylesheet" href="css/style.css" type="text/css" media="all"> <script src="js/jquery-1.6.js" ></script> <script src="js/cufon-yui.js"></script> <script src="js/cufon-replace.js"></script> <script src="js/Shanti_400.font.js"></script> <script src="js/Didact_Gothic_400.font.js"></script>  </head> <body id="page5"> <div class="body1"> <div class="body2"> <div class="main">  <header> <div class="wrapper"> <ul id="icons"> <li><a href="index.html"><img src="images/icon1.gif" alt=""></a></li> <li><a href="#"><img src="images/icon2.gif" alt=""></a></li> <li><a href="contacts.html"><img src="images/icon3.gif" alt=""></a></li> </ul> <span class="call">Need Help? Please email or call <span>1-800-345-5894</span></span> </div> <div class="wrapper"> <h1><a href="index.html" id="logo">Web Hosting</a></h1> <nav> <ul id="menu"> <li class="first"><a href="index.html">Home</a></li> <li><a href="hosting.html">Hosting</a></li> <li><a href="features.html">Features</a></li> <li><a href="about.html">About</a></li> <li id="menu_active"><a href="support.html">Support</a></li> <li><a href="contacts.html">Contacts</a></li> </ul> </nav> </div> <span id="slogan1">Simple<span>Clever</span><span>Effective</span></span> </header>  </div> </div> </div> <div class="main">  <section id="content"> <div class="wrapper"> <article class="col3"> </article> </div> </section>  </div> </div> <div class="main">  <footer>Copyright © <a href="#">Domain Name</a> All Rights Reserved<br> Design by <a target="_blank" href="http://www.templatemonster.com/">TemplateMonster.com</a></footer>  </div> <script>Cufon.now();</script> <div align=center>This template downloaded form <a href='http://all-free-download.com/free-website-templates/'>free website templates</a></div></body> </html>事件：

change

<强> DEMO

如果您想要计算每种类型的选择：

var results = {};

$('select').on('change', function() {
  var val = $(this).val();
  results[val] = (results[val] || 0) + 1;
});

DEMO

$('select').on('change', function() { var val = $(this).val(); var name = $(this).attr('name'); if (!results[name]) { results[name] = {}; } results[name][val] = (results[name][val] || 0) + 1; });将是这样的：

results

UPD：用于计算当前选择：

{
  "Forms[AgentIsPitch]": {
      "Yes": 1,
      "No": 2,
      "N/A": 3
  },
  "Forms[MandatoryOptIsStated]": {
      "No": 5,
      "N/A": 13
  },  
}

DEMO

Answer 2

试试这个 - https://jsfiddle.net/sergdenisov/h8sLxw6y/2/：

var count = {};
count.empty = $('select option:selected[value=""]').length;
count.yes = $('select option:selected[value="Yes"]').length;
count.no = $('select option:selected[value="No"]').length;
count.nA = $('select option:selected[value="N/A"]').length;

console.log(count);

Answer 3

你可以这么简单地做到这一点

where_filter = 'e4da3b7fbbce2345d7772b0674a318d5'

Students.objects.get(pk__md5=where_filter)

DEMO

Answer 4

我的方法是：

    var optionsYes = $("option[value$='Yes']:selected");
    var optionsNo = $("option[value$='No']:selected");
    var optionsNA = $("option[value$='N/A']:selected");

    console.log('number of yes selected = ' + optionsYes .length);
    console.log('number of no selected = ' + optionsNo .length);
    console.log('number of N/A selected = ' + optionsNA .length);

检查控制台（或替换为警报）。

使用您的代码，它会是这样的（假设您要检查按钮点击事件）：

<select name="Forms[AgentIsPitch]" id="Forms_AgentIsPitch">
 <option value="">Choose One</option>
 <option value="Yes">Yes</option>
 <option value="No">No</option>
 <option value="N/A">N/A</option>
</select>   


<select name="Forms[MandatoryOptIsStated]" id="Forms_MandatoryOptIsStated">
 <option value="">Choose One</option>
 <option value="Yes">Yes</option>
 <option value="No">No</option>
 <option value="N/A">N/A</option>
</select>  

<button class="btn btn-primary" id="countYes"></button>
<script type="text/javascript">
   $('#countYes').on('click', function(){
    var optionsYes = $("option[value$='Yes']:selected");
    var optionsNo = $("option[value$='No']:selected");
    var optionsNA = $("option[value$='N/A']:selected");

    console.log('number of yes selected = ' + optionsYes .length);
    console.log('number of no selected = ' + optionsNo .length);
    console.log('number of N/A selected = ' + optionsNA .length);
   });
</script>

您可以查看其他活动，我选择了一个按钮，例如。

Answer 5

有一种更简洁的方法可以做到这一点，但这将完成工作（假设有一个按钮点击触发事物）：

$("#theButton").on('click', function() {
    var totalSelect = 0;
    var totalYes = 0;
    var totalNo = 0;
    var totalNA = 0;

    $("select").each(function(){

        totalSelect++;

        if ($(this).val() == "Yes") { totalYes++; } 
        if ($(this).val() == "No") { totalNo++; } 
        if ($(this).val() == "N/A") { totalNA++; }

    });
});

希望这有助于事业。

从多个下拉计算唯一选择

5 个答案:

我的方法是：