英文:
jquery share $(this) between functions
问题
我尝试将每个处理程序中的这些代码行提取到一个名为 handlerShared()
的函数中。代码如下:
function handlerShared() {
var $this = $(this);
var dataKey = $this.attr("data-key");
pushHistory(dataKey);
removeActiveClass();
hideContent();
}
function handlerTabs() {
handlerShared();
$(this).addClass(activeClass);
var activeTab = $(this).attr('href');
$(activeTab).fadeIn();
return false;
}
function handlerDiagram() {
handlerShared();
scrollToTabs();
$(themeTab + "." + dataKey).addClass(activeClass);
var activeSVGTab = $(themeContent + "." + dataKey);
$(activeSVGTab).fadeIn();
return false;
}
$(themeTab).on("click", handlerTabs);
$(themeDiagram).on("click", handlerDiagram);
这样,您可以在 handlerTabs
和 handlerDiagram
中调用 handlerShared()
来共享相同的代码行,同时保持 $(this)
的上下文。
英文:
I have two click events that are almost identical, I am trying to refactor to make it more DRY. I want share some lines of code in a handlerShared() function - but I loose the context of $(this) which should be the DOM element that is clicked. There are two different elements an svg and button. They have some specific functionality but alot of it is the same. I guess what I want is a way to make $(this) select the specific DOM element.
function handelerShared() {
}
function handlerTabs() {
var $this = $(this)
var dataKey = $this.attr("data-key");
pushHistory(dataKey);
removeActiveClass();
hideContent();
$(this).addClass(activeClass);
var activeTab = $(this).attr('href');
$(activeTab).fadeIn();
return false;
}
function handlerDiagram() {
var $this = $(this)
var dataKey = $this.attr("data-key")
pushHistory(dataKey);
removeActiveClass();
hideContent();
scrollToTabs();
$(themeTab + "." + dataKey).addClass(activeClass);
var activeSVGTab = $(themeContent + "." + dataKey)
$(activeSVGTab).fadeIn();
return false;
}
I m try to take these lines of of each handler and out into a handlerShared()
var $this = $(this)
var dataKey = $this.attr("data-key");
pushHistory(dataKey);
removeActiveClass();
hideContent();
the clicks
$(themeTab).on( "click", handlerTabs );
$(themeDiagram).on( "click", handlerDiagram );
答案1
得分: 0
我相信你可以简单地传递这个元素:
function handlerShared(element) {
var $this = $(element);
var dataKey = $this.attr("data-key");
pushHistory(dataKey);
removeActiveClass();
hideContent();
}
function handlerTabs() {
handlerShared(this);
$(this).addClass(activeClass);
var activeTab = $(this).attr('href');
$(activeTab).fadeIn();
return false;
}
function handlerDiagram() {
handlerShared(this);
scrollToTabs();
$(themeTab + "." + dataKey).addClass(activeClass);
var activeSVGTab = $(themeContent + "." + dataKey)
$(activeSVGTab).fadeIn();
return false;
}
$(themeTab).on("click", handlerTabs);
$(themeDiagram).on("click", handlerDiagram);
英文:
I believe you can just pass the element around:
function handlerShared(element) {
var $this = $(element);
var dataKey = $this.attr("data-key");
pushHistory(dataKey);
removeActiveClass();
hideContent();
}
function handlerTabs() {
handlerShared(this);
$(this).addClass(activeClass);
var activeTab = $(this).attr('href');
$(activeTab).fadeIn();
return false;
}
function handlerDiagram() {
handlerShared(this);
scrollToTabs();
$(themeTab + "." + dataKey).addClass(activeClass);
var activeSVGTab = $(themeContent + "." + dataKey)
$(activeSVGTab).fadeIn();
return false;
}
$(themeTab).on("click", handlerTabs);
$(themeDiagram).on("click", handlerDiagram);
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论