Question

我要尝试的是更改选择框，然后更新另一组选择。

我有点麻烦，要让某些选择具有相同的选项，尽管不是全部，因为会有3个选择，其中1个称为用户，它在其他两组选择上调用更改-记录和发送，两者都可以具有任意数量的实际选择

到目前为止，我可以手动更改它们，但是由于没有固定数量，因此用户可以添加更多，因为这不是最佳解决方案

这是我到目前为止（推荐人选择的）

$('#user').on('change', function() {
  $('#rec1').empty()
  $('#rec1').load("ajax.php?action=userCardList&user=" + $("#user").val())
  $('#rec2').empty()
  $('#rec2').load("ajax.php?action=userCardList&user=" + $("#user").val())
});

提交表单后，需要将它们发送到另一个脚本，类似

$.get("ajax.php?action=tradeRequest&rec=" + $( "#rec1" ).val() + "," + $( "#rec2" ).val(), function(data, status) {

Answer 1

我能够通过执行以下操作来解决它。可能不是最好的方法，但是它有效

加载选择项：

$('#user').on('change', function() {
      $('#new_user_form select').each(function(key, value) {
        var name =  this.name.slice(0, 3);
        if(name == "rec") {
          $(this).empty()
          $(this).load("ajax.php?action=userCardList&user=" + $("#user").val())
        }
        if(name == "sen") {
          $(this).empty()
          $(this).load("ajax.php?action=ownCardList")
        }
      });
      $('#submit').prop("disabled", false);
    });

添加新字段-加载选择项

$( "#add" ).click(function() {
      var num = 0;
      $('#new_user_form select').each(function(key, value) {
        var number = this.name.slice(3)
        if(number > num) {
          num = number;
        }
      });
      var newNum = parseInt(num) + 1;
      var senNo = 'sen' + newNum
      var recNo = 'rec' + newNum
      $('#cards').append('<tr>' + 
          '<td valign="top" width="50%"><select id="' + senNo + '" name="' + senNo + '"></select></td>' + 
          '<td valign="top" width="50%"><select id="' + recNo + '" name="' + recNo + '"></select></td>' +
        '</tr>');
      
      $('#' + recNo).load("ajax.php?action=userCardList&user=" + $("#user").val())
      $('#' + senNo).load("ajax.php?action=ownCardList")
    });

最后，提交表单

$( "#submit" ).click(function() {
        var rec = [];
        var send = [];
      $('#new_user_form select').each(function(key, value) {
        var value = this.value;
        var name =  this.name.slice(0, 3);
        
        if(name == "rec") {
          if(value > 0) {
            rec.push(value);
          }
        }
        if(name == "sen") {
          if(value > 0) {
            send.push(value);
          }
        }
      });
      
      var text = "";
      if(rec.length > 0) {
        text = text + "&rec=" + rec
      }
      if(send.length > 0) {
        text = text + "&send=" + send
      }
      
      $.get("ajax.php?action=tradeRequest&receiver=" + $( "#user" ).val() + text, function(data, status) {
        $('#text').html(data);
        
        $('#new_user_form select').each(function(key, value) {
          var name =  this.name.slice(0, 3);
          if(name == "rec") {
            $(this).empty()
            $(this).load("ajax.php?action=userCardList&user=" + $("#user").val())
          }
          if(name == "sen") {
            $(this).empty()
            $(this).load("ajax.php?action=ownCardList")
          }
        });
      });
    });
    
  });
</script>

HTML / JQuery动态选择框

1 个答案: