如何将Javascript(jQuery)添加到从XSLT/XML创建的页面
How to add Javascript(jQuery) to a page created from XSLT/XML
我有一个XML文件(由几个数据项组成,即<Book>
)和我创建的一个相应的XSLT文件,在浏览器中打开该文件时,将该图书列表转换为html表。列命名为"Author", "Title"answers"BookID"(它们是<tr>
的子节点的id
s)。
现在我想使用jQuery使结果页面动态,也就是说,我想使结果表的行在我点击的列上排序。然而,虽然表格呈现得很好,但生成的jQuery代码似乎没有效果。
我不确定这是我的jQuery代码错误的结果,还是我没有正确地包含它,或者两者兼而有之。我在我的XSL文件中包含了两个<script></script>
标签(一个用于热链接jQuery库,另一个用于链接到我的代码),但我不确定这是否是正确的方法。此外,有人可以看看我的jQuery代码,找出是否有什么错误(我是一个完整的新手web编程,所以请原谅我的错误)?
谢谢!
$(document).ready(function() {
function sortBy(a, b, selectFunction) {
var a1 = selectFunction(a);
var b1 = selectFunction(b);
if (a1 < b1) {
return -1;
}
if (a1 > b1) {
return 1;
}
return 0;
}
function sortHelper(index) {
var rows = $('table tbody tr').get();
rows.sort(function(a, b) {
return sortBy(a, b, function(x) { return $(x).children('td').eq(index).text().toUpperCase(); });
});
rows.appendTo('tbody');
}
$('#Author').click(function() {
sortHelper(0);
});
$('#Title').click(function() {
sortHelper(1);
});
$('#BookID').click(function() {
sortHelper(2);
});
});
注释中声明的.get()
返回一个javascript对象。因此,要使用rows.sort()
,您需要jQuery对象。
// javascript
$(obj).get(0); // returns the first element from the query
// jquery
$(obj).eq(0); // return the first $(element) from the query.
我还注意到一件事:因为你是通过id
访问td的,你可以这样做:
var topRow = $("table tbody tr").eq(0),
topCells = topRow.find("td"); // expecting #author, #title, #bookid
topCells.click(function(){
sortHelper($(this).index()); // makes more sense this way
});
除此之外,如果你正在加载外部*.js文件到你的解决方案中,你会很好。如果您直接将代码插入页面,请使用CDATA编码,如下所述。
相关文章:
- IE10+11:XSLT转换将任意CR/LF添加到XML中
- 获取 XSLT 中的 XML 元素
- 如何在javascript中解析xml并从中提取xslt元素
- XML/XSLT in JavaScript
- Javascript XSLT Transformation with XML 存储在变量中
- 将javascript与XML和XSLT一起使用时出现问题
- Javascript XSLT 转换省略了 xml 声明
- 使用JavaScript、XSLT和XML在HTML上设置组合框的默认值
- 使用Greasemonkey脚本将javascript添加到用XSLT转换的XML文件中
- XSLT-将xml文档作为参数从javascript中传递
- 如何使用XSLT和javascript从XML创建HTML
- 使用XSLT导入XML的HTML页面
- javascript xml节点相等比较在XSLT内的函数中失败
- 在用于XML的XSLT中使用javascript在span标记中附加文本
- 如何将Javascript(jQuery)添加到从XSLT/XML创建的页面
- 在使用ESTK/InDesign导出时将XSLT应用于XML
- 使用javascript XML XSLT在最后一行设置单击事件
- InDesign使用XSLT 1将一个XML文件分解为多个XML文件
- 如何根据属性值在表中显示信息(XML-XSLT)
- 我如何使用JavaScript转换XML &XSLT