关于 jQuery 手机 <input type="range">
About the jQuery mobile <input type="range">
我用 jqm 创建了一个输入标签,像这样
<input type="range" min="1" max="40" value="1" step="0.1" autocomplete="off"/>
我写了javascript代码
$('.ui-slider-handle').click(function(){
var pix = parseFloat($(this).attr("title"));
console.log(pix);
});
电脑上没问题,手机上不行,所以我改了代码
像这样
$('.ui-slider-handle').on("tap",function(){
var pix = parseFloat($(this).attr("title"));
console.log(pix);
});
还是不行!
谢谢!
试试这个:
HTML:
<div data-role="page" id="page-1">
<div data-role="header">
<h4>Slider</h4>
</div>
<div data-role="main" class="ui-content">
<label for="slider">Slider</label>
<input type="range" name="slider" id="slider" min="1" max="40" value="1" step="0.1" autocomplete="off" />
slidestart: <input type="text" id="txt1">
slidechange: <input type="text" id="txt2">
slidestop: <input type="text" id="txt3">
</div>
</div>
JavaScript:
$(document).on("pagecreate", "#page-1", function() {
$("#slider").on("slidestart", function() {
var val = $(this).val();
$("#txt1").val(val);
});
$("#slider").on("change", function() {
var val = $(this).val();
$("#txt2").val(val);
});
$("#slider").on("slidestop", function() {
var val = $(this).val();
$("#txt3").val(val);
});
});
我用 jqm 创建了一个输入标签,像这样
<input type="range" min="1" max="40" value="1" step="0.1" autocomplete="off"/>
我写了javascript代码
$('.ui-slider-handle').click(function(){
var pix = parseFloat($(this).attr("title"));
console.log(pix);
});
电脑上没问题,手机上不行,所以我改了代码 像这样
$('.ui-slider-handle').on("tap",function(){
var pix = parseFloat($(this).attr("title"));
console.log(pix);
});
还是不行!
谢谢!
试试这个:
HTML:
<div data-role="page" id="page-1">
<div data-role="header">
<h4>Slider</h4>
</div>
<div data-role="main" class="ui-content">
<label for="slider">Slider</label>
<input type="range" name="slider" id="slider" min="1" max="40" value="1" step="0.1" autocomplete="off" />
slidestart: <input type="text" id="txt1">
slidechange: <input type="text" id="txt2">
slidestop: <input type="text" id="txt3">
</div>
</div>
JavaScript:
$(document).on("pagecreate", "#page-1", function() {
$("#slider").on("slidestart", function() {
var val = $(this).val();
$("#txt1").val(val);
});
$("#slider").on("change", function() {
var val = $(this).val();
$("#txt2").val(val);
});
$("#slider").on("slidestop", function() {
var val = $(this).val();
$("#txt3").val(val);
});
});