リンクを含むJavaScriptの範囲スライダーを作成するにはどうすればよいですか？

Question

私はそのような番号のリストを持っている：

<ul class="term-list"> 
<li class="term-item"><a href="/search?count=1">1</li> 
<li class="term-item"><a href="/search?count=2">2</li> 
<li class="term-item"><a href="/search?count=3">3</li> 
<li class="term-item"><a href="/search?count=4">4</li> 
<li class="term-item"><a href="/search?count=5">5</li> 
<li class="term-item"><a href="/search?count=6">6</li> 
</ul> 

私がやりたいことは、JavaScriptの（範囲）スライダーとしてこのリストを表示することです。ご覧のとおり、各番号にはリンクがあります。

リンク機能を失うことなくリストにスライダを適用するにはどうすればよいですか？スライダーで選択された番号（2秒待ってください）が表示されたら、この番号のリンクに移動します。

Answer 1

あなたが必要とするのは、スライドイベントです。そのようなものです。それは助けsetTimeout(function(){ // code}, 2000);

希望を使用し、ページを変更する前に2秒を待つために

$(document).ready(function(){ 
    $('.slider').on('slidestop', function(){ 
     window.location.href = "youpage/count" + $(this).val(); 
    }); 
}); 

！

• ニック

P.S. Jquery-UIを使用すると仮定しました。ここで

Answer 2

はcreateElement("a");に一例であり、あなたが生成されたリンク

ノートの属性を設定することができます：100から0からの利用可能なリンク。あなたの答えのための

$("#link_generator").on("change", function() { 
 
    //wait 2 seconds 
 
    setTimeout(openURL, 2000); 
 

 
    //or set attributes 
 

 
    /* var q = $("#link_generator").val(); 
 

 
    setTimeout(function(){ 
 

 
openURL({ 
 
    "href":"/search?count="+q, 
 
    "target":"_blank" 
 
    }); 
 

 
},3000); */ 
 

 
}); 
 

 
function openURL(attr) { 
 
    var q = $("#link_generator").val(); 
 

 
    var a = document.createElement('a'); 
 
    if (attr) { 
 
    for (var k in attr) { 
 
     a[k] = attr[k]; 
 
    } 
 
    return a.click(); 
 
    } 
 
    if (q > 0) a.href = "/search?count=" + q; 
 
    a.click(); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id='link_generator' type='range'> 
 
<br/>