Question

我想在有人点击链接时显示文本字段。我已经研究过这个结束但似乎没有什么工作。以下是我到目前为止的情况：

<span id="location_field_index">
  <a href="javascript:void(0)" onclick="innerHTML=\"<input type=\"text\" name=\"update_location\" value=\"<? echo $location_string; ?>\"" >
     <?php echo $location_string; ?>
  </a>
 </span>

我意识到这可能是错误的，但任何帮助都会很好。

Answer 1

您应该将字段放在表单上，然后将其隐藏在div中，直到您需要它为止。

<a href="..." onclick="document.getElementById('inputField').style.display = 'block';">Click me</a>

<div id="inputField" style="display:none;">
   <input type="text" id="textInput" value="..." />
</div>

Answer 2

我建议从元素本身删除click处理程序，并将其移动到外部函数。以下作品：

var a = document.getElementsByTagName('a');
var t = document.createElement('input');
t.type = 'text';

for (i = 0; i < a.length; i++) {
    a[i].onclick = function() {
        this.parentNode.appendChild(t);
        return false;
    };
}

JS Fiddle demo

Answer 3

你好像是在混淆php和javascript。对于纯javascript解决方案，您需要创建一个您希望在单击时调用的函数，如function ClickFunction()，然后在内部您将要使用Document.getElementById('location_field_index')获取该位置的元素。然后你想设置innerhtml属性。以下应该这样做

    function addBlock() {
        var elem = Document.getElementById('location_field_index');
        elem.innerhtml = "HTML HERE";
        return false;
    }

然后在链接中添加<a onclick="addBlock()">Click ME<a>

Answer 4

看看这个小提琴：http://jsfiddle.net/davecoulter/7vegU/

Answer 5

我返回false以防止链接重定向浏览器

<a href="#" onclick="linkClicked(event)">Link</a>
<input type="text" style="display:none;" id="txt" />

....

function linkClicked(event) {
    event.preventDefault();
    document.getElementById('txt').style.display = "block";
    return false;
}

Answer 6

请参阅此页面上的最后一个示例：http://api.jquery.com/show/

单击链接时显示文本字段

6 个答案: