Question

通常我会像这样放置JavaScript：

<head>
<title>Title goes here</title>
<script>
some JavaScript here
</script>
</head>

<body>
some codes here
</body>

但现在我有一个案例，必须生成JavaScript代码并且与HTML文件中的LI标记数相等：

$('#manage-1').click(function(e) { 
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-manage-1.php");
    e.preventDefault();
});
$('#manage-2').click(function(e) { 
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-manage-2.php");
    e.preventDefault();
});

我有一个想法是通过用这样的变量修改＃manage-1来从PHP创建JavaScript：#management- $ i和任何其他动态部分。

但是，是否可以像这样放置标签：

<head>
<title>Title goes here</title>
<script>
some JavaScript here

<?php
PHP code inside script tags
?>

</script>
</head>

Answer 1

使用A CLASS！

无需为每个元素添加一行代码。为要启用click事件的每个元素添加公共类。您将其用作选择器。它使代码更小更快。

HTML：

<a class="manage" data-file="test-manage-1.php">foo</a>

JavaScript的：

$(document).on('click', ".manage", function(e) { 
    var elem = $(this); 
    elem.next(".manage-content-wrap").find(".manage-content").load(elem.data("file"));
    e.preventDefault();
});

Answer 2

如果你想把你的JavaScript代码放在php标签中，那么你只需输入以下样式。

<head>
<title>Title goes here</title>
<?php echo"<script>
some JavaScript here

PHP code inside script tags


</script>";
?>
</head>

Answer 3

好的，我认为我们可以通过稍微改进一下你的技术来解决这个问题。

你真的不需要多个.click处理程序，你需要有一个更好的选择器策略。

假设你用这个围绕你的LI：

<ul class="managers">
    <li><a href="" id="manage-1">Link Text 1</a></li>
    <li><a href="" id="manage-2">Link Text 2</a></li>
    <li><a href="" id="manage-3">Link Text 3</a></li>
    <li><a href="" id="manage-4">Link Text 4</a></li>
</ul>

现在，你真的只需要一个.click处理程序：

$(".managers li a").click(function(evt) {
    evt.preventDefault();
    var mID = $(this).attr("id");
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-" + mID + ".php");
});

请注意，您可能必须以这种方式修改您找到正确的.manage-content元素的方式，但您应该明白这一点。

通过这种方式，您也不会在演示方面将您的数据与您的数据紧密联系在一起，并且您会稍微干掉您的代码。几乎每当你看到自己需要吐出完全相同的自动生成代码时，除了几个细节之外，还有机会简化方法。

希望这有帮助！

Answer 4

或者如果它对所有人来说都是一样的话，请考虑使用课程。

$('.manage').click(function(e) { 
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-manage-2.php");
    e.preventDefault();
});

否则，您可以在此处使用for()循环。

<?php
    for($i = 1; $ < 5; $i++){?>
$('#manage-<?php echo $i; ?>').click(function(e) { 
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-manage-<?php echo $i; ?>.php");
    e.preventDefault();
});
<?php }
?>

Answer 5

您应该使用类和数据属性而不是ID来编写HTML标记。

例如：

<a href="#" class="manager" data-id="1">Manager 1</a>
<a href="#" class="manager" data-id="2">Manager 2</a>

然后您可以使用类选择器来获取所有“经理”链接，如下所示：

$('.manager').click(function(e) {
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-manage-" + $(this).data('id') + ".php");
    e.preventDefault();
});

假设你有jQuery。

Answer 6

你可以用php做任何事情，因此也可以将它用作jquery代码生成器你只是回应特定区域的jquery（就像你写的那样），那就是它

Answer 7

在您的javascript示例中，您可以使用jquery通配符，假设您的id有助于定义php页面的URL：

/* Get all items with an id starting with manage and assign the click event */
$("[id^=manage]").click(function(e) { 
    $(this).next(".manage-content-wrap").find(".manage-content").load("test-" + $(this).attr('id') + ".php");
    e.preventDefault();
});

JSFiddle：http://jsfiddle.net/YM5AS/

使用PHP动态创建JavaScript并将其放在<script> Tags </script>之间

7 个答案: