6

我习惯做这样的事情：

<a href="Javascript:void(0);" onclick="GetCommentForGeneralObservation(<%# Eval("ID") %>)">

那将在中继器或类似的东西中。但是我现在尝试使用不显眼的 JavaScript，从而摆脱标记中的任何 JS。我试图弄清楚在这种情况下最好的做法是什么？我使用了属性，然后使用 JQuery 将值传递给 AJAX 调用，但这似乎有点 hack。

根据第一个回复进行编辑：

我想更多的是

将功能（“行为层”）与网页的结构/内容和表示分离。

据我了解，它是不显眼的 JS 的一部分。

这恰好适用于我不必担心 Javascript 在客户端被关闭的应用程序，它在我的公司内部托管。我得到的是，如果我要通过 JQuery 将 onclick 事件附加到单独的 .js 文件中，我将如何将 Eval("ID") 中的值获取到 JS 调用中。

抱歉没有更清楚。我很欣赏在面向公众的应用程序中需要逐步增强。

4

7 回答 7

12

在 HTML 5 中，您可以定义自己的属性，前缀为 'data-'

例如

<a  
class="comment"
data-rendered-id="<%# Eval("ID") %>"
href="/getCommentForGeneralObservation/<%# Eval("ID") %>" >

然后在单击事件处理程序中使用 jQuery 中的该属性。

$(".comment").click(function () {
  var id = $(this).attr("data-rendered-id");
  return GetCommentForGeneralObservation(id);
});

只要支持 jQuery，这也适用于大多数 HTML5 之前的浏览器。

请注意，在不显眼的 javascript 中，您确实应该支持非 javascript 浏览器，因此您需要一个也可以工作的 href 属性。

于 2009-09-22T15:40:25.600 回答
4

我会开始：

<a href="/getCommentForGeneralObservation/<%# Eval("ID") %>" class="getCommentForGeneralObservation">

然后附加一个看起来像这样的事件处理程序：

function (event) {
    var href = this.href;
    var id = href.search(/\/(\d+)/);
    return GetCommentForGeneralObservation(id);  
};
于 2009-09-22T15:28:19.633 回答
3

不显眼意味着您不依赖 Javascript 的功能，因此您的代码是用 Javascript 扩展而不是被它取代。

在您的情况下，您将 Javascript 直接嵌入到链接中，更糟糕的是，如果没有启用 Javascript，链接将根本无法工作。相反，你会想要这样的东西，它是纯 HTML，没有任何对 Javascript 的引用：

<a id="commentLink" href="comment.asp">Get Comment</a>

您的 Javascript（假设您没有使用框架）将类似于：

function GetCommentForGeneralObservation(evt) {
  // Extra javascript functionality here
}

document.getElementById("commentLink").onclick = GetCommentForGeneralObservation;

使用 Jquery，我相信您可以这样做：

$("#commentLink").click(GetCommentForGeneralObservation);
于 2009-09-22T15:13:05.140 回答
2

我将重新回答这个问题，因为我现在理解了这个问题，而且我通常使用的方法与迄今为止建议的方法不同。

当无法避免动态内容时，我通常会执行以下操作：

<script type="text/javascript">
  var myApp = {commentId:<%# Eval("ID") %>};
</script>
<script type="text/javascript" src="myAppScript.js"></script>

现在，在 myAppScript.js 中，您可以myApp["commentId"]在任何需要引用该 ID 的地方使用。（我使用字典以免污染全局命名空间）

这种方法的优点是您的 myAppScript.js 仍然是完全静态的，因此您可以非常快速地提供它。它还具有将相关信息排除在 URL 之外的优点，并且您可以使用 Javascript 对象，这对处理复杂和/或难以解析的数据有很大帮助。

缺点是它需要内联 Javascript，除非您是网络完美主义者，否则这并不是什么缺点。

我也很喜欢 DanSingerman 的方法，如果您的数据特定于某个标签，这种方法更适合。

于 2009-09-22T16:04:06.613 回答
1

您可能希望使用 JQuery 元数据插件或核心数据功能。

http://docs.jquery.com/Core/data

http://plugins.jquery.com/project/metadata

于 2009-09-22T16:02:31.640 回答
0

您可以使用标签的rel属性anchor来存储要与链接关联的值。

<a href="#n" class="comment" rel="<%# Eval("ID") %>">Click Here</a>

然后在您的 jQuery 代码中，您可以检查 rel 属性以获取您正在寻找的值。

$(".comment").click(function () {
  return GetCommentForGeneralObservation(this.rel);
});

（很确定这对于 jQuery 来说是准确的，但我更像是一个 MooTools 人......）

于 2009-11-20T15:07:18.910 回答
-1

如何确保它完全不引人注目？

在 HTML 文档的头部

<script src="path/to/php/or/other/equivalent/server/side/file"></script>

在 path/to/php/or/other/equivalent/server/side/file 中：

var SiteServerVariablesEtc = {
    someProperty: <?php echo "hello" ?>
 }

在您的普通 JS 文件中：

var myVar = SiteServerVariablesEtc.someProperty;
于 2009-10-15T14:05:15.750 回答