Jquery - 根据检查两个数组乘以静态数来查找成本

时间:2014-01-16 18:14:22

标签: javascript jquery

我的第一篇文章,所以我希望我做对了,对不起,我还在学习,所以不确定我是否正确发布。我有点做的是伪代码代码我需要什么,但执行是远离的。 所以我的变量是书籍,程序和课程。

要查找我的图书费用,我需要检查该程序属于哪个组(数组),然后将其乘以正在采用的课程数。

var programGroup1=["Arts", "Crafts", "Painting"];
var programGroup2=["Zumba", "Ballet", "Jazz"];
var programGroup3=["Math", "Science", "History"];
var books

if(programGroup1){
  books = course * 10
}else if(programGroup2){
  books = course * 20
}else if(programGroup3){
  books = course * 30
}else{
  end();
}

<select id="program" name="program" >
<option value="" selected="true">--</option>
<option value="Arts" >Arts</option>
<option value="Crafts" >Crafts</option>
<option value="Painting" >Painting</option>
<option value="Zumba" >Zumba</option>
<option value="Ballet" >Ballet</option>
<option value="Jazz" >Jazz</option>
<option value="Math" >Math</option>
<option value="Science" >Science</option>
<option value="History" >History</option>
</select>
<select id="course" name="course">
<option value="" selected="true">--</option>
<option value="5">5</option>
<option value="4">4</option>
</select>

那么如果你拿艺术和课程5你的书将是10 * 5,它将输出50美元,或者如果你拿工艺品和课程5它将是20 * 5并将输出100美元。

感谢任何帮助,我真的想学习,只需要一些帮助。

2 个答案:

答案 0 :(得分:1)

这样的事情:

// If a select changes
$('select').change(function () {
  var psel, csel, program, course, total;

  // Get the values of both selectors
  psel = $('#Program').find('option:selected').val();
  csel = $('#course').find('option:selected').val();

  // Assign the program var a value depending on the program type
  if (psel.indexOf('Arts') > -1) { program = 10; }
  if (psel.indexOf('Crafts') > -1) { program = 20; }

  // Set the value of course to the value of the selected option
  course = csel;

  // Add them together
  total = program * course;

  // And only if they all exists (if both selections have been done), alert the total
  if (program && course && total) {
    alert('Total ' + total);
  }
});

Working demo

答案 1 :(得分:0)

你最好做这样的事情:

  • 对于每个程序,设置一个操作和值,如下所示:$('option[value="Arts"]').data({ action:'*', value: 10 });
  • 当其中一个select更改时,获取值和操作,然后将其应用到费用中。

示例HTML:

<select id="program" name="program" >
    <option value="" selected="true">--</option>
    <option value="Arts" >Arts</option>
    <option value="Arts2" >Art2s</option>
    <option value="Arts3" >Arts3</option>
    <option value="Crafts" >Crafts</option>
    <option value="Crafts2" >Crafts2</option>
    <option value="Crafts3" >Crafts3</option>
</select>
<select id="course" name="course">
    <option value="0" selected="true">--</option>
    <option value="5">5</option>
    <option value="4">4</option>
</select>

使用jQuery示例JS:

$(function() {
    $('#program option[value=""]').data({ action:'*', value: 0 });
    $('option[value="Arts"]').data({ action:'*', value: 10 });
    $('option[value="Arts2"]').data({ action:'*', value: 20 });
    $('option[value="Arts3"]').data({ action:'*', value: 30 });
    console.log($('option[value=Arts]').data());

    $('select').on('change', function() {
        var cost = parseFloat($('#course').val());
        var program = $('#program').val();
        var program_obj = $('#program option[value="'+program+'"');
        var action = program_obj.data('action');
        var arts_val = parseFloat(program_obj.data('value'));
        switch(action) {
            case '*':
                cost = cost * arts_val;
                break;
            case '/':
                cost = cost / arts_val;
                break;
            case '+':
                cost = cost + arts_val;
                break;
            case '-':
                cost = cost - arts_val;
                break;

        }
        alert(cost);

    });
});

Here's a working fiddle