jquery按鈕點擊事件未解僱

我創建了一個jQuery滑動效果。源是從jsfiddle http://jsfiddle.net/YNAJZ/68/獲得。它在jsfiddle中工作正常。但不能在我的本地系統中工作。未點擊按鈕點擊事件。我花了更多的時間，但我找不到爲什麼它不工作。jquery按鈕點擊事件未解僱

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<script src="http://code.jquery.com/jquery-1.7.2.js"></script> 
<style type="text/css"> 
#container { 
    width:100%; 
    height:500px; 
    background:#ccc; 
    position:relative; 
    overflow-x:hidden; 
} 
#left { 
    position:absolute; 
    width:100%; 
    height:500px; 
    left:0px; 
    background:yellow; 
} 
#right { 
    position:absolute; 
    width:100%; 
    height:500px; 
    background:red; 
    right:0%; 
} 
</style> 
<script> 
$('#Viewstruct,#viewgrid').click(function(){ 
    alert('enter here'); 
     if (parseInt($('div#right').css('right'),10) < 0) { 
       // Bring right-column back onto display 
        $('div#right').animate({ 
         right:'0%' 
        }, 1000); 

        $('div#left').animate({ 
        width:'100%' 
        }, 600); 
       } else { 

     // Animate column off display. 
        $('div#right').animate({ 
         right:'-100%' 
        }, 600); 

        $('div#left').animate({ 
        width:'100%' 
        }, 1000); 
     } 

}); 
</script> 
</head> 

<body> 
<a id="Viewstruct" title="View Structure" rel="tooltip" href="#">View Structure</a><a id="viewgrid" data-original-title="View Grid" href="#" title="View Grid">View Grid</a> 
<div id="container"> 
    <div id="left"> LEFTgdsfgsdfgdsfg</div> 
    <div id="right"> RIGHT FADASSD ASDAJKSH ASHDK:L JASKDJ ASKLJSDKJA ASKJD KAJSDKJAS LKJDKLAJ LAKSJD AKLJD KASJDK JALSKDJ LKAJSDLK JASDKLJ ASLKDJ AKLSJD LKASJD LKASJD LKJASD KJAS LKASJ DKASJDK JAS KLDJASDKJ ASLK </div> 
</div> 
</body> 
</html>

來源

2014-02-25 user3085540

你能做到這一點還的方式把它在功能上然後在您的按鈕應用內嵌事件處理程序，例如**的 ** –

，請把你的點擊功能準備塊內

$(document).ready(function() { 

$('#Viewstruct,#viewgrid').click(function(){ 
    alert('enter here'); 
     if (parseInt($('div#right').css('right'),10) < 0) { 
       // Bring right-column back onto display 
        $('div#right').animate({ 
         right:'0%' 
        }, 1000); 

        $('div#left').animate({ 
        width:'100%' 
        }, 600); 
       } else { 

     // Animate column off display. 
        $('div#right').animate({ 
         right:'-100%' 
        }, 600); 

        $('div#left').animate({ 
        width:'100%' 
        }, 1000); 
     } 

}); 

});

來源

2014-02-25 03:37:28 Sarath

它的工作很好，謝謝.. – user3085540

你需要把你DOM準備處理$(document).ready(function() { ... })或較短的形式內部代碼：$(function() {.... });。此步驟用於確保頁面文檔對象模型（DOM）已準備好執行JavaScript代碼。

您的代碼正在jsFiddle中工作，因爲jsFiddle已自動爲您完成。

另外，使用jsFiddle時，您不需要鏈接到External Resources中的外部jQuery文件。您可以通過從Frameworks and Extensions選項卡中選擇它來包含jQuery。

來源

2014-02-25 03:35:54 Felix

jquery按鈕點擊事件未解僱

回答

相關問題