Question

我有这个fiddle，它会显示一个包含多个选择的列表框，如果单击“读取”，则会获取所选值并将其放入<p>标记。

两个问题：

1）如何修改我创建的小提琴，所以当你完成选择列表框中的项目后，它会自动将它们放入<p>标签中？我猜你是沿着“改变”路线走下去的。

2）如何修改我创建的小提琴，因此它将所选值的数组放入隐藏输入，然后提交回到MVC3控制器？这样做是否可以实现？

更新以你们的答案为例，我想我会分享我设法实现并完成你的答案，这个例子显示在fiddle

单选列表框
根据第一个列表框的选定项目动态更改第二个列表框的内容
显示从第二个框中选择的项目，其中包含最后一个列表框中的选定值，并且全部放在隐藏的输入中

感谢各位花时间帮助我：）

Answer 1

这里是小提琴http://jsfiddle.net/tAaRR/2/

我刚用以下内容替换了您的javascript代码：

 $(document).ready(function () {
     $('#App_RunFromUSB').change(function () {
         if ($('#App_RunFromUSB:checked').length > 0) {
             $('#jj').show('1000');
         } else {
             $('#jj').hide('1000');
         }
     });

     $('#SelectBox').change(function () {
      var Value = '';
             var text = '' 

         $("#SelectBox option:selected").each(function () {
            Value+=$(this).val();
             text +=$(this).text();
             $("#selectedValues").append(Value + ": " + text + "<br />");
         });
      alert(text);
         $('#hidden1').val(text);

     });

 });

希望这会有所帮助。如果有任何问题让我知道。

Answer 2

出于好奇，通过一些优化更新了你的小提琴并减少了许多非必需的代码。如果你愿意，你可以看看。

http://jsfiddle.net/tkkSr/

$(function () {       
     var artItems = ["Art 1","Art 2","Art 3","Art 4","Art 5","Art 6"];
     var vidItems = ["Video 1","Video 2","Video 3","Video 4","Video 5","Video 6"];
     $('#SelectBox').change(function () {
         var str = "", inHTML = "",items;
         items = $(this).val() == 'art' ? artItems: vidItems;
         $.each(items,function(i,ob){
             inHTML += '<option value="'+i+'">'+ob+'</option>'
         });
         $("#SelectBox2").empty().append(inHTML);
     });

     $('#SelectBox2').change(function () {
         $("#selectedValues").text($(this).val() + ';' + $("#SelectBox").val());
         $('#hidden1').val($(this).val());
     });

 });

Answer 3

这个jQuery应该做..... example here.

$("#SelectBox").change(function(){
$("#selected").empty();

$("#SelectBox option:selected").each(function(){
    $("#selected").append("<p>" + $(this).val() + " : " + $(this).html() + "</p>"); 
    });
});

现在，如果要将所选项目包含在隐藏值中并将其发布到控制器，则可以使用AJAX调用或隐藏的表单值。

JQuery设置MVC Post的隐藏输入

3 个答案: