从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; 
}