懸停添加類對角JS

我想在代碼角懸停添加類對角JS

<li ng-mouseenter="cola-selected=true" class="pull-left" ng-class="{'selected' : cola-selected}"> 
    <a href="interna.html"> 
     <img src="assets/images/cola.png"> 
    </a> 
</li>

這是所有功能的頁面都會有，所以我雖然也許徘徊在li元素時下面加個班它不一定要爲js添加一個新的js文件。

當鼠標進入li時，它應該有新類selected。它上面的代碼不工作，我不明白爲什麼。

這裏是我的代碼在小提琴的例子：https://jsfiddle.net/mjrmeffc/

來源

2015-12-26 Pablo

本教程應該可以幫助您https://scotch.io/tutorials/the-many-ways-to-use-ngclass如果不是的話，我會盡快寫一個答案。 –

爲什麼你需要一個額外的文件，如果你可以在你的應用程序的角度寫的邏輯是什麼？

我假設你使用ng-app並在你的邏輯中有一個所謂的javascript文件，你應該在這裏包含它。

以下是添加/刪除類的正確方法的示例。

<div ng-app> 
    <div 
    class="italic" 
    ng-class="{red: hover}" 
    ng-mouseenter="hover = true" 
    ng-mouseleave="hover = false"> 
     Test 1 2 3. 
    </div> 
</div>

NB我發現這在另一個計算器問題，請正確使用谷歌搜索的第一，我沒有足夠的信譽標誌你的問題，或作出評論。

*編輯*

好像你還沒有熟悉AngularJS。無論你想調用它，你都需要包含你的'app.js'或'script.js'。在那裏，你定義使用

var app = angular.module('yourappname', [/* add your dependencies here*/]); 

//Other logic like controllers or services

您的應用程序的HTML應該是

<div ng-app="yourappname"> 
<div ng-controller="yourController">

請澤瀉自己，然後你開始問問題

來源

2015-12-26 14:52:38

我只是複製你的代碼，它似乎和我的一樣，但是，我有同樣的問題，紅色的類沒有添加。 – Pablo

你能否提供一個codepen/jsfiddle或在這裏包含你的javascript文件？ –

我已更新我的問題鏈接到jsfiddle – Pablo

嘗試使用ng-mouseover ATTR

<li ng-mouseover="hoverIn()" class="pull-left" ng-class="{{applyClass}}">

wri TE的一種功能hoverIn()在你的腳本，並指定值時，將鼠標懸停在

$scope.hoverIn = function() { 
    this.applyClass = "red"; 
}

Working Demo

來源

2015-12-26 15:38:20

懸停添加類對角JS

回答

相關問題