window.location.href不工作，爲什麼不呢？

我在window.location.href中遇到了一些問題。在我的網站上我使用AngularJS（框架）。我有一個表，下面的代碼：window.location.href不工作，爲什麼不呢？

<table id="MAND"> 

       <tbody id="hoveren"> 
        <tr ng-repeat="artist in artists | filter:name"> 

        <td class="user-name"><img id="{{artist.div}}" style="vertical-align: middle;" src="{{artist.img}}"></td> 
        <td class="user-email" style="vertical-align: middle;">{{artist.name}}</td> 
        <td class="user-phone" style="vertical-align: middle;">{{artist.description}}</td> 
        <td class="user-phone" style="vertical-align: middle;">{{artist.country}}</td> 
        </tr> 

       </tbody> 
      </table>

所以你看到可使圖像divname。

然後jQuery中，我調用下面的函數：

$("#crunch").click(function() { 
window.location.href = "http://example.com/new_url"; 
});

在這種情況下，{{ 「artist.div」}}等於緊縮，所以這就是爲什麼#crunch。

爲什麼不能正常工作？

我點擊它，但沒有任何反應。

這是某種愚蠢的錯誤嗎？

謝謝！

順便說一句，如果你想知道，我的angularjs部分：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
angular.module('App', []) 
 
.controller('Controller', function($scope){ 
 
\t $scope.artists = [ 
 
\t { 
 
\t \t "name": "Crunchyroll", 
 
\t \t "country": "All countries except Japan", 
 
\t \t "img":"images/crunchy.png", 
 
\t \t "description":"You can set it to everything you want!", \t 
 
\t \t "div":"crunch" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "Rhapsody", 
 
\t \t "country": "US only, be at the right spot", 
 
\t \t "img":"images/rhap.png", 
 
\t \t "description":"You can set it to everything you want!" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "Febreze", 
 
\t \t "country": "US only", 
 
\t \t "img":"images/feb.jpg", 
 
\t \t "description":"You can set it to everything you want!" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "Kellogs Froot Loops", 
 
\t \t "country": "US only", 
 
\t \t "img":"images/kel.jpg", 
 
\t \t "description":"You can set it to everything you want!" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "Pure Asia Garcinia Weight Loss", 
 
\t \t "country": "US, AU, CA, UK and NZ only", 
 
\t \t "img":"images/bottle.png", 
 
\t \t "description":"You can set it to everything you want!" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "Free Computer", 
 
\t \t "img":"images/pc.png", 
 
\t \t "description":"You can set it to everything you want!" 
 
\t \t }, 
 
\t \t { 
 
\t \t "name": "whateveee", 
 
\t \t "country": "All countries except Japan", 
 
\t \t "img":"images/crunchy.png", 
 
\t \t "description":"You can set it to everything you want!", \t 
 
\t \t "div":"crunch" 
 
\t \t } 
 
\t ]; 
 

 
});

不要順便說一句運行，不知道如何把它放在

謝謝！

來源

2015-06-26 Wobba Fam

您的jQuery代碼可能在這些div分配了該ID之前運行，因此事件偵聽器無法附加到不存在的元素。我強烈建議你嘗試用ng-click代替。 – yvesmancera

您需要將您的代碼更新爲以下內容。在綁定事件時，html中沒有id #crunch元素，因此綁定永遠不會發生。

因此，對於動態添加的元素，您需要綁定像下面這樣的事件。

$(document).on('click', '#crunch', function(){ 
    window.location.href = "http://example.com/new_url"; 
});

來源

2015-06-26 18:42:40 nikhil

非常感謝！ –

偉大的它爲你工作。您始終可以將答案標記爲接受以供將來參考 – nikhil

您的代碼應該工作的時候事件處理程序ID爲元件提供crunch存在連接，它似乎沒有。使用委託事件來解決這個問題

$("#MAND").on('click', '#crunch', function() { 
    window.location.href = "http://example.com/new_url"; 
});

來源

2015-06-26 18:43:27

jQuery應該真的是這裏的最後一招。優先採用Angular方法。

進樣$window到控制器中：

.controller('Controller', function($scope, $window){

添加此功能，您的控制器：

$scope.go = function(artist) { 
    $window.location.href = "http://example.com"; 
};

更改您的視圖使用ng-click：

<img id="{{artist.div}}" ng-click="go(artist)" ...

Plunker demo.

來源

2015-06-26 18:55:20

window.location.href不工作，爲什麼不呢？

回答

相關問題