javascript - 如何使用下拉菜单打开新框架/窗口

标签 javascript html drop-down-menu

当点击“创建节点”按钮时,如何打开一个新的框架或窗口?我希望新框架包含一个文本字段和下拉菜单,以便用户可以选择一个选项。

<form>
<html>
<body>
  <button onclick="myFunction()">Create node</button><br>
  <br>
  <button onclick="myFunction()">Search node</button><br>
  <br>
  <button onclick="myFunction()">Create Realationship</button><br>
</body>
</html>
</form>

从上面的代码中,我可以创建并单击按钮,但无法创建新框架,并且我不知道如何提供选项供用户选择。

最佳答案

我认为你的意思是:

var myFunction = function() {
   //create some html elements with the createElement function
    var select = document.createElement("select"),
        input = document.createElement("input");
    var head = document.createElement("h2");
    var option1 = document.createElement("option");
    var option2 = document.createElement("option");

    //change the content of elements
    head.innerHTML = "select and edit option";

    option1.innerHTML = "option 1";
    option2.innerHTML = "option 2";
    //you can add an element to another element with element.appendChild("new child element here")

    select.appendChild(option1);
    select.appendChild(option2);

    //you can set all attributes with element.setAttribute("attribute name", "attribute value")
    input.setAttribute("type", "text");

    //open a window, with no url and a specified width and height
    var w = window.open('', "", "width=600, height=400, scrollbars=yes");

    //again add children elements, but now insert them to the created window which is stored in the 'w' variable (note that it does not replaces the document, it only means that you represent another window)
    w.document.body.appendChild(head);
    w.document.body.appendChild(select);
    w.document.body.appendChild(input);
}

在这里摆弄:http://jsfiddle.net/tkf4cnqo/5/

您还可以加载预定义的网址,但很难使其动态化。

希望这对您有帮助。

关于javascript - 如何使用下拉菜单打开新框架/窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28266224/

相关文章:

javascript - jQuery Ajax POST 保存删除提交

javascript - uploadify改变脚本数据

javascript - 未捕获的语法错误 : Unexpected token : in chrome

html - 可折叠下拉菜单下方的文本不可选择,链接不可点击

html - 下拉菜单看起来很奇怪(纯 css)

jquery - 合并 Twitter Bootstrap 组件 : Dropdown and Accordion

html - 在 HTML/Bootstrap/angular2 中的动态填充下拉列表中预选外来内容

javascript - 如何使箭头键和空格键不强制我的网页下降?

html - 两个 float 的 div 没有完全包含在父 div 中

javascript - 如何连续播放播放列表中的所有音乐?