Javascript 韩元'；t在页面中执行（在JSFIDLE中工作）_Javascript_Jquery

Javascript 韩元'；t在页面中执行（在JSFIDLE中工作）

javascript jquery

Javascript 韩元'；t在页面中执行（在JSFIDLE中工作）,javascript,jquery,Javascript,Jquery,首先我想说我对JavaScript和Jquery非常陌生，所以希望这是一个简单的例子我有一些JS代码来安排几个div标记的顺序，这些标记在JSfiddle（）中工作然而，当我试着把它放到网页上时，什么也没发生 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>Testing</title> <link rel="stylesheet"

首先我想说我对JavaScript和Jquery非常陌生，所以希望这是一个简单的例子

我有一些JS代码来安排几个div标记的顺序，这些标记在JSfiddle（）中工作

然而，当我试着把它放到网页上时，什么也没发生

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Testing</title>


    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.9.1.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">

  <script>
$('button').on('click', function (event) {
var divElements = $('#tours div'),
    sortType = $(this).data('sort');

divElements.sort(function (a, b) {

    a = $(a).data(sortType);
    b = $(b).data(sortType);

// compare
    if (a > b) {
        return 1;
    } else if (a < b) {
        return -1;
    } else {
        return 0;
    }
});

$('#tours').empty();
$.each(divElements, function (i, divElement) {
    $('#tours').append(divElement.outerHTML);
});

});

  </script>

</head>

<body>

<button data-sort='price'>Sort By Price</button>
<button data-sort='duration'>Sort By Duration</button>
<button data-sort='name'>Sort By Name</button>
<section id="tours">
<div class="result" data-price="749" data-duration="8" data-name="Basecamp">Info about tour 1 goes here</div>
<div class="result" data-price="2099" data-duration="19" data-name="Cycle Adventure">Info about tour 2 goes here</div>
<div class="result" data-price="1099" data-duration="25" data-name="Family Adventure">Info about tour 3 goes here</div>
<div class="result" data-price="3014" data-duration="18" data-name="Luxury Basecamp">Info about tour 4 goes here</div>
</section>

</body>
</html>


测试
$（'button'）。在（'click'）上，函数（事件）{
var divElements=$（“#tours div”），
sortType=$（this.data（'sort'）；
divElements.sort（函数（a，b）{
a=$（a）.数据（sortType）；
b=$（b）.数据（sortType）；
//比较
如果（a>b）{
返回1；
}否则如果（a


非常感谢您的帮助
在将元素添加到DOM
之前执行的javascript
代码。您需要将javascript代码放在主体
结束标记之前或
传递给.ready（）的处理程序保证在
DOM已经准备好了，所以这通常是连接所有其他对象的最佳位置
事件处理程序并运行其他jQuery代码
而且，它在JSFIDLE中工作，因为JSFIDLE被设置为在onLoad
处理程序中运行javascript。将其设置为“in”，JSFIDLE也会遇到同样的问题。