Javascript 使用jquery创建基于用户输入数组的交互式菜单

Javascript 使用jquery创建基于用户输入数组的交互式菜单,javascript,jquery,html,arrays,iframe,Javascript,Jquery,Html,Arrays,Iframe,我创建了一个网页,允许用户根据文本框中的输入更新多个iFrame。我想扩展这个页面的功能,允许用户一次输入多个值 这些值将由新行分隔,我希望在某种侧栏菜单中显示所有值,我希望用户能够通过单击值和/或通过下一个或上一个按钮循环值来选择值 以下是当前页面的工作方式: <input type="text" id="user"> <iframe id="frame1" width="450px" height="880px" src="" frameborder=0></

我创建了一个网页,允许用户根据文本框中的输入更新多个iFrame。我想扩展这个页面的功能,允许用户一次输入多个值

这些值将由新行分隔,我希望在某种侧栏菜单中显示所有值,我希望用户能够通过单击值和/或通过下一个或上一个按钮循环值来选择值

以下是当前页面的工作方式:

<input type="text" id="user">

<iframe id="frame1" width="450px" height="880px" src="" frameborder=0></iframe>
<iframe id="frame2" width="450px" height="880px" src="" frameborder=0></iframe>
<iframe id="frame3" width="450px" height="880px" src="" frameborder=0></iframe>

<div class="button">Submit</div>

// Clicks submit button if enter key is pressed
$("#user").keyup(function(event){
  if(event.keyCode == 13){
    $(".button").click();
  }
});

// If submit button is pressed, update iframes with contents of text box 
$(".button").click(function(){
    $('#user').val(function(n,c){
       $('#frame1').attr('src', "url" + c);
       $('#frame2').attr('src', "url" + c);
       $('#frame3').attr('src', "url" + c);
       $('#user').attr('value',c);
       return c
    });
});
据我所知,我需要通过基于新行拆分值将用户输入添加到数组中,如前所述。然后使用类似于所描述的内容来显示它们

我真正需要解决的是如何将这些数组值放入用户可以交互的边栏菜单中。希望如果我能做到这一点,我可以使用单击处理程序来更新iFrame


任何帮助都将不胜感激,谢谢

可能是这样的:

希望对你有帮助给出反馈

            var myarray = $('#myTextArea').val().split("\n");

我花了一点时间才弄明白你在那里做了什么,但我认为这应该很有效,谢谢!您需要将左侧菜单中的fidle属性更改为jquery 1.7.2,并且不在head中换行以使其工作。。。