Question

我是新手，所以我会尽量清楚，我试图用Jquery和AJAX创建一个单页面应用程序。然而，没有任何反应，没有任何错误。

转到主要，第二和第三是超链接指向：＃/ main，＃/ second，＃/ third

另外，first.html，second.html，third.html是应从中检索数据的页面。

检查我的代码并告诉我是否有问题：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
	<script>
			window.addEventListener('hashchange', function (){
			
				if(window.location.haschange === '#/main'){
				$.get( "first.html", function( data ) {
			  $( "#examples" ).html( data );
				})
			}
				
				if(window.location.haschange === '#/second'){
				$.get( "second.html", function( data ) {
			  $( "#examples" ).html( data );
				})
			}
				
				if(window.location.haschange === '#/third'){
				$.get( "third.html", function( data ) {
			  $( "#examples" ).html( data );
				})
			}
				
		});
	</script>

＆＃13;

 <## Heading ##html>
<head>
<title>text</title>
</head>
<body>
	<ul>
		<li><button><a href="#/main">Go to Main</button></li>
		<li><button><a href="#/second">Go to Second</button></li>
		<li><button><a href="#/third">Go to Third</button></li>
	</ul>
	
	<div id="examples">
		
	</div>
	
</body>
</html>

<!-- begin snippet: js hide: false -->

＆＃13;

Answer 1

使用window.onhashchange = function(req){ /*your code*/ }

Answer 2

这是你想要的另一种方法。

var currentPage = "#main" ;

$('.page').on('click', function(event)
{
    page =  $(event.target).children().first().attr('href') ;
    if ( page != currentPage ) 
    {
        currentPage = page ;
        alert(page) ;
        // your if conditions here 
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<## Heading ##html>
<head>
<title>text</title>
</head>
<body>
	<ul>
		<li><button class="page"><a href="#main">Go to Main</a></button></li>
		<li><button class="page"><a href="#second">Go to Second</a></button></li>
		<li><button class="page"><a href="#third">Go to Third</a></button></li>
	</ul>
	
	<div id="examples">
		
	</div>
	
</body>
</html>

<!-- begin snippet: js hide: false -->

Answer 3

我发现答案没有错，代码只是它只支持http服务器请求，或者另一种选择是使用angularJS

HasChanged在Jquery中不起作用

3 个答案: