從CSS動態添加焦點風格

Question

我在對話框中有一個textboxleft邊和和圖標（div）在右邊。 當我正在開啓對話框時，兩者都應該重點關注。

HTML

<input id="text-link" class="form-control" onfocus="this.select();" onclick="this.select();"/> 
      <div class="form-control" id="link"></div> 

我試過下面

1. $("#link").focus(); 
2. document.getElementById("link") 

但不工作。

請建議一個css樣式動態添加焦點到該div。

Answer 1

試試這個：

JQUERY：

$(document).ready(function(){ 
    $("#link").removeClass("focusdiv"); 
    $("#text-link").focus(function(){ 
     $("#link").addClass("focusdiv"); 
    }); 
}); 

CSS：

.focusdiv{ 
    box-shadow: inset 1px 1px 5px 1px #eee; // Put box-shadow as your need. 
    -moz-box-shadow: inset 1px 1px 5px 1px #eee; 
    -webkit-box-shadow: inset 1px 1px 5px 1px #eee; 
    border: 2px solid #ccc; 
}