如何将javascript数组传递给onclick =“（'here'）”？

Question

我有一个程序，要求我不断地从屏幕上来回发送数组到服务器。 阵列很重要，所以我需要它。

因此它在onclick中作为一个php数组开始 - >它转到javascript并再次调用php函数然后将其返回到javascript函数。 这就是我失去的地方。 返回php数组后，我试图将其重新放入onclick中，以便当用户再次单击时，将使用onclick发送新数组。

我该怎么做呢？

到目前为止我有什么：

在javascript中，在收到成功消息并且PHP函数传递新数组之后，我有类似这样的设置，其中msg保存值。 msg.question_id只保存一个整数，msg.array持有一个php数组。

document.getElementById('buttons').innerHTML ="<a href='javascript:void(0)' onclick=\"movie_guess('yes',"+msg.question_id+","+msg.array+")\"><img  src=\"/assets/yes.png\" ></a><a href=\"javascript:void(0)\" onclick=\"movie_guess('no',"+msg.question_id+","+msg.array+")\"><img  src=\"/assets/no.png\" ></a> ";

Answer 1

好吧，我想你不应该在ajax响应中返回PHP数组。 您可以将其作为带分隔符的字符串发送。 成功响应后，您可以拆分它们并创建一个javascript数组。 您也可以使用JSON。 对其进行编码以访问它。

$phpArr=( 0 => 'Zero', 1 => 'One', 2 => 'Two'); // PHP Code
var jsArr= <?php echo json_encode($phpArr); ?>; // Javascript Code
for($i=0;<stop-condition>;$i++){      alert(jsArr[i]);  } // Javascript Code

Answer 2

这是您尝试添加的元素，正确缩进：

<a href='javascript:void(0)' onclick=\"movie_guess('yes',"+msg.question_id+","+msg.array+")\">
  <img  src=\"/assets/yes.png\" >
</a>
<a href=\"javascript:void(0)\" onclick=\"movie_guess('no',"+msg.question_id+","+msg.array+")\">
  <img  src=\"/assets/no.png\" >
</a>

相反，你可以在没有处理程序的情况下添加它（我也使用#作为链接目标;还要注意我如何避免需要转义引号以及如何将长字符串拆分为多行）：

var buttons = document.getElementById('buttons');
buttons.innerHTML = 
  '<a href="#"><img src="/assets/yes.png"></a>'+
  '<a href="#"><img src="/assets/no.png"></a>'

然后将事件处理程序添加为函数。 这样可以提高性能，并允许您传递当前作用域中可见的任何内容（我假设msg是一个javascript对象并且它不会更改）。 addEventListener还有onclick=function(){...}其他好处：

var links = buttons.getElementsByTagName("a");
links[0].addEventListener("click", function(){
  movie_guess('yes', mgs.question_id, msg.array);
});
links[1].addEventListener("click", function(){
  movie_guess('no', mgs.question_id, msg.array);
});

---

更长但更快的版本是根本不触摸innerHTML ，而是操纵DOM：

var buttons = document.getElementById('buttons');
var aYes = document.createElement("a");
aYes.href = "#";
aYes.addEventListener(...);
var imgYes = document.createElement("img");
imgYes.src = "/assets/yes.png";
aYes.appendChild(imgYes);
buttons.appendChild(aYes);
var aNo = document.createElement("a");
...