1. 程式人生 > >一些前端效果的實現

一些前端效果的實現

選中tr效果

選中tr標籤出現一個選中效果,即給選中的tr添加個顏色,並移除其他未選中的tr的顏色效果

<style type="text/css">
    tr.focus{background-color: #eee;cursor: pointer;}
</style>


$('tr').on('click',function(){
      var $tr=$(this);
      $tr.parent().find('tr.focus').toggleClass('focus'); //取消原先選中行
      $tr.toggleClass('focus'); //
設定當前選中 });

效果:顏色#eee(灰色) ,滑鼠設定為手(pointer)的樣式

限制字數輸入

<!--顯示150字的輸入-->
<textarea rows="" cols="" style="width:100%;" maxlength="150" 
        onchange="this.value=this.value.substring(0,150)" 
        onkeydown="this.value=this.value.substring(0,150)"
        onkeyup="this.value=this.value.substring(0,150)"
></textarea>