초기 상태:
으아악1. 당연히 가장 많이 반복되는 클래스 이름은 weui_icon_search-focus인데, 수정이 필요하다면 한곳에서 수정하면 되지 않을까요? 으아악
2.focus Blur 이 두 이벤트는 실제로 거의 동일한 작업 동작을 가지므로 캡슐화해야 합니까? 이 경우 여러 곳에 쓰여 있는 weui_icon_search-focus 문제도 해결할 수 있습니다으아악
하지만 if(searchMain.val())로 판단한 위치의 동작은 어쩔 수 없군요. 결국 fn과도 함께 해야 한다고 생각합니다. , 두 개를 변경해야 합니다. fn에 매개변수를 추가하여 두 번째 문장만 실행하도록 할 수도 있지만, 정상적으로 실행된다면 여전히 그 정도의 판단을 거쳐야 한다는 것이 항상 불편합니다~아직 완벽한 솔루션이 있나요? ~
이보다 더 좋은 방법은 생각나지 않습니다. 개인적으로는 jquery 객체일 때 $를 추가하면 변수를 구분할 수 있다고 생각합니다
var $searchMain = $('.c-search_search'), // 온톨로지 검색
으아아아if ($searchMain.val()) {
으아아아}
$searchMain.on('초점', 함수 () {
으아아아}).on('blur', function () {
으아아아});
function fn(a,mark) {
으아아아}
캡슐화를 위해 캡슐화하는 중입니다. 함수는 한 가지 작업만 수행하는 것이 가장 좋습니다.
hide 및 show도 토글을 사용하여 함께 패키징할 수 있지만 일반 addClass는 이 기능과 분명히 다릅니다.
여기에는 명령이 하나만 필요하므로 함께 캡슐화할 필요가 없습니다. 그리고 이때 비슷한 요구사항이 있다면 캡슐화한 함수에 또 다른 판단을 추가해야 할까요?
여기서 함수를 캡슐화하는 목적은 가독성을 높이기 위한 것이지만, 비슷한 기능을 무턱대고 함께 캡슐화하는 것은 그 반대입니다.
위 답변에 동의합니다.
귀하의 요구 사항은 하나의 요소를 표시하고 포커스가 있을 때 다른 요소에 클래스를 추가하는 것입니다. 초점을 잃는 것은 그 반대입니다.
그러면 구현은 다음과 같아야 합니다
으아아아논리는 명확하고 명확합니다. 왜 불필요한 캡슐화가 필요한가요?
단순화를 고려해야 한다면 요소를 표시하고 요소에 클래스 스타일을 추가하는 관점에서 고려해야 합니다. 예를 들어 상위 요소에
show
클래스를 추가합니다. CSS의 하위 선택기를 사용하여 요소 표시/숨기기 및 스타일 전환 문제를 완료합니다.show
。 来使用css中的子选择器完成你对元素显示隐藏和样式切换的问题。这样就只用在focus时给
이런 방식으로.parent
这个元素添加show
样式,blur
으아아아.parent
요소에 포커스가 있을 때만show
스타일을 추가하고blur
일 때는 제거하면 됩니다. >. 🎜