3

我有这个fiddle，它显示了一个带有多个选择的列表框，如果您单击读取，它会获取选定的值并将它们放入<p>标记中。

两个问题：

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

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

更新： 接受你们提出的答案，我想我会用你们的答案分享我设法实现和完成的事情，这个小提琴中显示的例子

  • 单选列表框
  • 根据第一个列表框的选定项动态更改第二个列表框的内容
  • 显示从第二个框中选择了哪些项目，最后从第一个列表框中选择了值，这些都放在隐藏的输入中

谢谢大家花时间帮助我:)

4

3 回答 3

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);

     });

 });

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

于 2013-03-20T10:14:52.583 回答
1

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

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());
     });

 });
于 2013-03-21T04:33:06.263 回答
0

这一点 jQuery 应该做......这里的例子。

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

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

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

于 2013-03-20T10:02:32.997 回答