シングルクリックショー、ダブルクリックして隠すスライダー

ここで私はページ設定を行います。ここでは、テキストをシングルクリックするとスライダーが表示され、値の範囲を選択できます。スライダを削除するダブルクリックを追加したいと思います。ここでシングルクリックショー、ダブルクリックして隠すスライダー

http://anacepts.com/main/anam/slider_select9c.html#

HTMLです：

<!DOCTYPE html> 
<html> 
<head> 
<style> 
<!--    CSS    --> 
.extra-controls { 
    position: relative; 
    padding: 10px 0 0; 
} 

</style> 


<link href="css/ion.rangeSlider.css" rel="stylesheet"> 

<link href="css/ion.rangeSlider.skinHTML5.css " rel="stylesheet"> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>  
<script src="js/ion.rangeSlider.min.js"></script> 

<script src="js/myslider_new.js"></script>  

</head> 
<body> 

<!--     HTML  --> 

<form id="live-search" action="" class="styled" method="get"> 
    <fieldset> 
     <input type="text" class="text-input" id="filter" value="" /> 
     <span id="filter-count"></span> 
    </fieldset> 
</form> 

<div id = "div0"> 

<a id = "a_G" href = "#" >Games</a> 

</div> 

<div> 

<input type="hidden" id = "slider_G"/ > 


</div> 

<div> 
<form action="sliderselect5.php" method="get"> 
<div class="extra-controls"> <input type="hidden" id="from_G" name = "g-low" value="0" /><input type="hidden" id="to_G" name = "g-high" value="0" /></div> 

<input type="submit" value="Submit"> 
</form> 
</div> 


<script> 


$(document).ready(function(){ 

//---Selecting sliders------ 

    $("#filter").keyup(function(){ 

     // Retrieve the input field text and reset the count to zero 
     var filter = $(this).val(), count = 0; 

     // Loop through the comment list 
     $("a").each(function(){ 

      // If the list item does not contain the text phrase fade it out 
      if ($(this).text().search(new RegExp(filter, "i")) < 0) { 
       $(this).fadeOut(); 

      // Show the list item if the phrase matches and increase the count by 1 
      } else { 
       $(this).show(); 
       count++; 
      } 
     }); 

     // Update the count 
     var numberItems = count; 
     $("#filter-count").text("Number of Selection = "+count); 
    }); 
}); 
</script> 

<script> 

var $range_G = $("#slider_G"), 
$inputFrom_G = $("#from_G"), 
$inputTo_G = $("#to_G"), 
instance_G; 

$("#a_G").on("click", function() { 
    createSlider_G(); 
}); 




</script> 


</body> 
</html>

出典

2016-04-29 Hasan Alanam

私はあなたがあなたがjQueryのを使用することができます

$("#a_G").on("dblclick", function() { 
    # removeSlider_G(); 
});

出典

2016-04-29 20:51:24 PhilVarg

は、応答をありがとう！ –

にリスナーを追加したいと思い期待dblclickイベントがあります.dblclick（）関数

<script type="text/javascript"> 
    $("#a_G").dblclick(function() { 
     alert("DoubleClick!"); 
     .... 
    }); 
</script>

しかし、私はそれがfollwingコードをチェックし、あなたが同じクリック機能を持つことができ、スライダを表示/非表示すると思う：

<script type="text/javascript"> 

    //assign a variable hidden 
    var hidden = 1; 

    $("#a_G").click(function() { 

     if(hidden == 1) 
     { 
      //if the slider is hidden.. 
      alert("Show the slider"); 

      //make the slider visible 
      //change the value of the variable hidden as 0 
      hidden = 0; 
     } 
     else 
     { 
      //if the slider is visible 
      alert("Hide the Slider"); 

      //make the slider invisible 
      //change the value of the variable hidden as 1 
      hidden = 1; 
     } 

    }); 

</script>

出典

2016-04-29 20:56:55

シングルクリックショー、ダブルクリックして隠すスライダー

答えて

関連する問題