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

时间:2015-02-01 18:28:29

标签: 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>

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

2 个答案:

答案 0 :(得分:2)

我认为你的意思是:

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/

您也可以加载预定义的网址,但不会让它变得动态。

我希望这会对你有所帮助。

答案 1 :(得分:0)

从你开始,代码不正确。应在正文中创建<form><html>应该是文档中的第一个标记。接下来,如果我理解正确,您只需要在单击任何按钮后创建一个新窗口。

您只需创建一个名为myFunction的函数,然后将window.open('http://google.com')传递给它。你可以在那里使用你想要的任何网址,所以如果你的网站是http://example.com,你可以在http://example.com/node1.html创建一个包含按钮和文本字段的页面,你可以将window.open('http://google.com')更改为{{1 }})`

window.open('http://example.com/node1.html