我正在成功使用mark.js并且当我们返回第一次出现时我添加了一个条件然后我们更改页面(因为我正在使用它分页数据表)。
代码:
jQuery(function() {
// the input field
var $input = jQuery("input[type=\'search\']"),
// clear button
$clearBtn = jQuery("button[data-search=\'clear\']"),
// prev button
$prevBtn = jQuery("button[data-search=\'prev\']"),
// next button
$nextBtn = jQuery("button[data-search=\'next\']"),
// the context where to search
$content = jQuery(".search_content"),
// jQuery object to save <mark> elements
$results,
// the class that will be appended to the current
// focused element
currentClass = "current",
// top offset for the jump (the search bar)
offsetTop = 50,
// the current index of the focused element
currentIndex = 0;
/**
* Jumps to the element matching the currentIndex
*/
function jumpTo() {
if ($results.length) {
var position,
$current = $results.eq(currentIndex);
$results.removeClass(currentClass);
if ($current.length) {
$current.addClass(currentClass);
position = $current.offset().top - offsetTop - 100;
window.scrollTo(0, position);
}
}
}
/**
* Searches for the entered keyword in the
* specified context on input - Note the 'on input'
*/
$input.on("input", function() {
var searchVal = this.value;
$content.unmark({
done: function() {
$content.mark(searchVal, {
separateWordSearch: true,
done: function() {
$results = $content.find("mark");
currentIndex = 0;
jumpTo();
}
});
}
});
});
/**
* Clears the search
*/
$clearBtn.on("click", function() {
$content.unmark();
$input.val("").focus();
});
/**
* Next and previous search jump to
*/
$nextBtn.add($prevBtn).on("click", function() {
if ($results.length) {
currentIndex += jQuery(this).is($prevBtn) ? -1 : 1;
if (currentIndex < 0) {
currentIndex = $results.length - 1;
}
if (currentIndex > $results.length - 1) {
currentIndex = 0;
}
//THE PART WHERE I CHANGE THE PAGE
if(currentIndex == 0 && jQuery(this).is($nextBtn)){
if(confirm("No more instances found! Go to the next page?")){
alert("NEXT PAGE");
jQuery("a[data-page=\'2\']").click();
//need to trigger an input event or to search again?
}else{
//do nothing
}
}
jumpTo();
}
});
});
因此,您可以看到此行:jQuery("a[data-page=\'2\']").click();
允许我们更改页面
但是当它完成后,我想跳转到第一次出现的新页面如果有的话,而不是必须改变输入。
所以我试着写
$("#input").val(
$("#input").val() + "a"
);
即使它不是理想的解决方案,它也是一种向搜索输入添加内容以触发“输入事件”的方法,但即使成功添加了caracter,它也无法正常工作
我也试过写:
$content.unmark({
done: function() {
$content.mark(searchVal, {
separateWordSearch: true,
done: function() {
$results = $content.find("mark");
currentIndex = 0;
jumpTo();
}
});
}
});
页面更改后,并使searchVal
全局,但它也没有做任何事情
所以我被困在这里,试图在第二页上自动搜索我的学期但没有成功,你能帮忙吗?