php - Make a text field appear when a link is clicked - Stack Overflow

admin管理员组

文章数量:1356588

I want to have a text field appear when somebody clicks a link. I have researched this to end but nothing seems to quite work. Here is what I have so far:

<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>

I realize this is probably so far wrong, but any help would be nice.

I want to have a text field appear when somebody clicks a link. I have researched this to end but nothing seems to quite work. Here is what I have so far:

<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>

I realize this is probably so far wrong, but any help would be nice.

• php
• javascript

Share Improve this question Follow edited Jan 8, 2019 at 1:54 anothermh 10.6k33 gold badges3939 silver badges5858 bronze badges asked Aug 22, 2011 at 18:53 Ryan HemeltRyan Hemelt 12722 silver badges77 bronze badges 1

• Dude... please, PLEASE learn better code standards :(. Check out the JavaScript wiki for more information. – Incognito Commented Aug 22, 2011 at 19:19

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 5

You should put the field on the form and just hide it in a div until you need it.

<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>

I'd suggest removing the click handler from the element itself, and moving it to an external function. The following works:

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.

You seem to be mixing php with javascript. For a pure javascript solution you need to create a function that you want to be called on click like so function ClickFunction() then inside you are going to want to get the element of the location using Document.getElementById('location_field_index'). Then you want to set the innerhtml attribute. The following should do it

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

Then inside the link add <a onclick="addBlock()">Click ME<a>

Check out this fiddle: http://jsfiddle/davecoulter/7vegU/

I'm returning false to prevent the link from redirecting the browserL

<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;
}

Please see the last example on this page: http://api.jquery./show/

本文标签： phpMake a text field appear when a link is clickedStack Overflow