click最喜歡的明星

-1

我想讓星星點亮它的時候着色，但是因爲我的Javascript和HTML文件都在單獨的文件夾中，我該如何將javascript中的函數恢復爲html文件？click最喜歡的明星

HTML

<input type="hidden" name="rating" id="rating" /> 
<ul> 
<li id="fav">★</li> 
</ul>

的Javascript

function addRating(obj) { 
    $('li').each(function(index) { 
     $(this).toggleClass('selected'); 
     $('#rating').val((index+1)); 
     if(index == $("li").index(obj)) { 
      return false; 
     } 
    }); 
} 

$("#fav").click(function(){ 
    addRating(obj); 
});

的CSS

li{float:left; margin-left:9px;display: inline-block;color: #F0F0F0;text-shadow: 0 0 1px #666666;font-size:30px;} 
.highlight, .selected {color:#F4B30A;text-shadow: 0 0 1px #F48F0A;}

來源

2017-05-03 roz ab

只是傳遞this到addRating它擁有所有者對象的上下文。

function addRating(obj) { 
 
    $('li').each(function(index) { 
 
    $(this).toggleClass('selected'); 
 
    $('#rating').val((index + 1)); 
 
    if (index == $("li").index(obj)) { 
 
     return false; 
 
    } 
 
    }); 
 
} 
 

 
$("#fav").on('click',function() { 
 
    addRating(this); 
 
});

li { 
 
    float: left; 
 
    margin-left: 9px; 
 
    display: inline-block; 
 
    color: #F0F0F0; 
 
    text-shadow: 0 0 1px #666666; 
 
    font-size: 30px; 
 
} 
 

 
.highlight, 
 
.selected { 
 
    color: #F4B30A; 
 
    text-shadow: 0 0 1px #F48F0A; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="hidden" name="rating" id="rating" /> 
 

 
<ul> 
 
    <li id="fav">★</li> 
 

 
</ul>

來源

2017-05-03 06:12:08 RonyLoud

你真的應該解釋你做和如何回答這個問題有什麼變化。 –

@RonyLoud爲什麼它的工作時，CSS是「li {....}」，但如果CSS是「li＃fav {...}」，因爲我在我的代碼中有更多的李不工作？ –

@rozab當你使用「li＃fav {...}」時，它通過'id'勝出了「li {....}」，因爲它只是元素選擇器。所以使用'！important'來優先考慮新班級。檢查[Fiddle]（https://jsfiddle.net/pandeyvishal1986/35a3aeuj/#&togetherjs=RNEUNIAfKp）。 – RonyLoud

click最喜歡的明星

回答

相關問題