Question

我想创建两个按钮，一个用户可以按下它，然后出现一个drop drown和一个输入文本字段，另一个用于删除这个按钮，如果用户愿意的话。

我已在Google上搜索过但无法找到它。

祝你好运， Valter Henrique。

Answer 1

[这里的工作演示：http：//jsfiddle.net/GNnSw/1/] [1]

你的HTML

<div id="box" style="display:none;">
        <select>
        <option value="test">Test</option>
    </select>
    <input type="text" value="" id="text1" />
    <input type="text" value="" id="text2" />
</div>
<input type="button" value="show" id="show" />
<input type="button" value="hide" id="hide" />

在jQuery中：

$('#show').live('click', function(){
    $('#box').show();
});

$('#hide').live('click', function(){
    $('#box').hide();
});

http://jsfiddle.net/GNnSw/4/

Answer 2

使用jquery可能需要：

<button onclick="$('form').show();">press it</button>

<form>
 //input elements
</form>

在google btw中搜索更难。

Answer 3

用jQuery做。

HTML

<button id="buttonid" value="Click on me!">

的jQuery

$("#buttonid").click(function(){
    var $input = '<input id="inputid" type="text" value="value">';
    // make the input field
    var $select = '<select id="selectid"></select>';
    // make the select
    var $opt1 = '<option name="one">one</option>';
    var $opt2 = '<option name="two">two</option>';
    // make two options
    $select.append($opt1).append($opt2);
    // append to select the options
    $(this).after('<form action="url" method="POST"></form>').append($input).append($select);
    // append input and the select after the button
});

噢，是的。 :)你需要jquery library。

Answer 4

为您的字段创建“占位符”：

<div id="placeholder"></div>

添加按钮/链接：

<a onClick="add()">Add Form</a><a onClick="remove()">Remove Form</a>

这是你的javascript文件：

function add() {
document.getElementById('placeholder').innerHTML = "Code for your form...";
}

function remove() {
document.getElementById('placeholder').innerHTML = "";
}

Answer 5

我认为通过使用外部JavaScript库实现灵活且用户友好的HTML布局的最佳方式，例如jQuery或mootools。原因是 - 在传统的Web框架将HTML 内容发送到Web浏览器之后，服务器无法使用它进行操作。此外，我认为良好的原则是仅使用Java来提供内容，并使用客户端框架来完成用户界面的所有魔术。此外，您将找到大量示例如何使用this one等库。

如果你真的想坚持普通Java，因为你可能对JavaScript有所了解，我建议你查看Google Web Toolkit和Vaadin。您可以几乎不受任何限制地编写Java代码，并且它将自动“转换”（编译）为JavaScript。但是应该深入考虑这个决定，因为学习GWT或Vaading可能更耗时并且不总是适用。

如何使用javascript输入和删除字段？

5 个答案: