javascript - 将变量发送到 javascript(jquery) 函数

Question

当我单击链接时，我无法将变量发送到 JavaScript 函数，但由于某种原因，我无法在互联网上找到有关如何执行此操作的任何地方。

这是我页面顶部的函数:

<script>
$(document).ready(function(){
$('[name=updateInterface]').click(function() {
$("#interfaceScreen").load("modules/interface/interfaceScreen.php?h= &v= ");
});
});
</script>

如您所见，我需要将变量放置在“h=”和“v=”部分之后。

这是在我的页面中激活该功能的链接:

<a href="#" name="updateInterface"><img src="images/map/invisible.png" border="0" /></a>

Answer 1

变量从哪里来？这很简单:

var h = 20;
var v = 40;
$(function() {
  $('[name=updateInterface]').click(function() {
    $("#interfaceScreen").load("modules/interface/interfaceScreen.php?h=" +
      encodeURIComponent(h) + "&v=" + enocdeURICompoennt(v));
  });
});

只要确保使用 encodeURIComponent() 来逃避它们即可.

您当然可以从任何地方获取它们，例如:

<input type="text" id="txth">
<input type="text" id="txth">

然后:

var h = $("#txth").val();
var v = $("#txtv").val();

编辑:好的，从您的评论中我了解到您希望将信息从服务器发送回客户端，以便客户端可以将其发送回。第一种是以非 jquery 的方式执行点击处理程序:

<a href="javascript:handle_click(17,43);">Click me</a>

与:

function handle_click(h, v) {
  $("#interfaceScreen").load("modules/interface/interfaceScreen.php?h=" +
    encodeURIComponent(h) + "&v=" + enocdeURICompoennt(v));
}

这可能是最简单的解决方案。如果您想坚持使用 jquery 单击处理程序，您始终可以将此信息嵌入到属性或隐藏元素中。例如:

<a href="#" class="special"><div class="special-h">12</div><div class="special-v">34</div>Click me</a>

使用 CSS:

a.special div { display: none; }

和:

$(function() {
  $("a.special").click(function() {
    var h = $(this).children("special-h").text();
    var v = $(this).children("special-v").text();
    $("#interfaceScreen").load("modules/interface/interfaceScreen.php?h=" +
      encodeURIComponent(h) + "&v=" + enocdeURICompoennt(v));
  });
});

这个主题有很多变体。

最后，我会指出，我建议您不要使用可以避免的属性查找选择器。为 anchor 提供一个类和/或 ID，并使用其中之一来分配事件处理程序。还可以使用“a.special”这样的选择器而不是“.special”(出于性能原因)。