Question

我有以下代码，我试图通过单击结果将搜索结果添加到div。让我知道，如果有人可以提供帮助，我看了大约一百次的代码，似乎无法弄清楚为什么它不会工作。我已经尝试将javascript放在div下面，身体下方和头部，没有骰子。下面是PHP，javascript和HTML。感谢。

使用Javascript：

<script type="text/javascript">
      var oButton = document.getElementById('addData');
      var data = document.getElementById('dataInput');
      var display = document.getElementById('display');

      oButton.onclick = function() {
         display.innerHTML += data.value + "<br />";
      }
   </script>

PHP：

echo '<button id="addData">','<input id="dataInput" type="hidden" value="'.$results_row['username'].'" />','<div id="testt">', '<h3>', $results_row['username'],'</h3>','</div>','</button>';

HTML：

<div id ="search_results"></div>
    <p>
                      <div id="display"></div> 

                    </p>

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="search.js"></script>

Answer 1

如果您可以在服务器端代码中获得结果，那么下面的代码应该是解决方案。试试吧。

 <input type="hidden" id="dataInput" value="This is my hidden value">

    <div id="display"></div> 


  <input type="button" name="oButton" id="oButton" onClick="fnc()" value="click">

 <script type="text/javascript">
 function fnc()
 {
   var oButton = document.getElementById("addData");
   var data = document.getElementById("dataInput");
   var display = document.getElementById("display");


     display.innerHTML += data.value + "<br />";
   }

Answer 2

在onload块中设置javascript

window.onload = function(e){ 
      var oButton = document.getElementById('addData');
      var data = document.getElementById('dataInput');
      var display = document.getElementById('display');

      oButton.onclick = function() {
         data = document.getElementById('dataInput'); // make sure the value is updated
         display.innerHTML += data.value + "<br />";
      }
}

这样您就可以确定可以为oButton分配onclick功能。并且还要确保更新数据，否则它将始终包含“初始”数据（可能是''）

Answer 3

这是您的预期，使用您的.$results_row['username'].值而不是我的硬编码值：

<p><div id="display"></div></p>

<?php echo '<button id="addData" onClick="fnc()">','<input id="dataInput" type="hidden" value="Hardcoded value" />','<div id="testt">', '<h3>', 'Hardcoded value','</h3>','</div>','</button>'; ?>

<script type="text/javascript">
 function fnc()
 {
  var oButton = document.getElementById("addData");
  var data = document.getElementById("dataInput");
  var display = document.getElementById("display");

  display.innerHTML += data.value + "<br />";
 }
</script>

将输入值添加到div

3 个答案: