0

我有一个按钮，可以将下拉菜单附加到站点，下拉值属性中是数字。我正在使用 ajax 函数使用下拉列表中的值运行数学方程。这是我的代码：

var data1 = $('#data1').val();
var data2 = $('#data2').val();
var data3 = $('#data3').val();


$.ajax({
  type: 'GET',
  url: 'ajaxcalc.php',
  data: {
    data1: data1,
    data2: data2,
    data3: data3
   },
  dataType: 'json',
  cache: false,
  success: function(data) { alert('yay!'); })
   });
  },
 });

//show dropdowns code
$('#data1').click(function() {
var $d = $('<select name="data1" id="data1"><option selected="selected" value="null">Choose your data!</option><option value="5">Option 1</option><option value="1">Option 2</option><option value="14">Option 3</option></select><br/>').fadeIn().delay(1000);
$('.data1').append($d);
});

//html button code for append data1 drop down
<button id="data1">Add Dropdown</button>

当人们使用相同的 id 附加 2 个相同的下拉列表并且我无法检索这两个变量时，我的问题就出现了......它只获得第一个下拉值！

在我的 ajaxcalc.php 文件中，我有这个来检索变量：

$data1 = $_GET['data1'];
$data2 = $_GET['data2'];

我试图让某人将 data1 下拉两次并选择 2 个不同的值，但仍然通过 .ajax() 函数将这些值传递给我的 ajaxcalc.php 文件！有谁知道我怎么能做到这一点？

4

1 回答 1

1

在您的情况下，您没有id“data2”或“data3”。您继续附加“data1”。附加下拉列表时，您需要使用 id 递增数字。

//show dropdowns code
var dropdownCount = 1;
$('#data1').click(function() {
    var $d = $('<select name="data' + dropdownCount + '" id="' + dropdownCount + '"><option selected="selected"          value="null">Choose your data!</option><option value="5">Option 1</option><option value="1">Option 2</option><option value="14">Option 3</option></select><br/>').fadeIn().delay(1000);
    $('.data1').append($d);
});

尝试使用该代码代替您的下拉代码。

编辑

更好的解决方案是使用类而不是ids。如果每个下拉列表都有一个class，您可以全部选择它们（无论添加了多少）并遍历它们以获取值。

var dropdowns = $(".dropdowns");
//Loop through them to get values and pass them to your ajax call

编辑2

这是我一起完成的小提琴，展示了如何添加多个下拉列表并将数组传递回您的 PHP 页面，而不是单个变量。

http://jsfiddle.net/JtUuN/

于 2012-08-03T02:36:39.807 回答