我想用范围滑块计算输入值;当我调整滑块上的数量时,我得到计算输出,但是如果我手动输入一个值,滑块会改变,但计算不会更新。
var finalvalue = '';
var finalbtprice = '';
var finalbitvalue = '';
finalprice = 3449.31;
var $rangeslider = $('#js-amount-range');
var $amount = $('#js-amount-input');
$rangeslider.on('input', function() {
var newVal = $amount[0].value = this.value;
var textval = parseInt(newVal);
if (textval >= 0 && textval < 1000) {
finalvalue = 0.16;
finalbitvalue = textval * finalvalue;
} else if (textval < 1001 && textval < 3000) {
finalvalue = 0.14;
finalbitvalue = textval * finalvalue;
} else if (textval <= 100000) {
finalvalue = 0.12;
finalbitvalue = textval * finalvalue;
}
finalbtcvalue = finalbitvalue / finalbtprice;
if (finalbitvalue) {
$("#getdolval").html("<strong>" + finalbitvalue.toFixed(2) + "</strong>");
}
});
$amount.on('input', function() {
$rangeslider.val(this.value).change();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="range" id="js-amount-range" value="10" min="10" max="100000">
<input type="number" id="js-amount-input" value="10" min="10" max="100000"></input>
<span id="getdolval">0 $</span>
答案 0 :(得分:1)
您已在范围内注册import React, { Component } from 'react';
import { View, StyleSheet,FlatList,Button } from 'react-native';
export default class App extends Component {
render() {
return (
<View style={styles.container}>
<FlatList
data={[...Array(5).keys()].map(String)}
renderItem={({ item }) => (
<Button title={item} />
)}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#ecf0f1',
},
});
事件处理程序,但是,您已触发input
事件。请尝试触发change
事件。
input
$rangeslider.val(this.value).trigger('input'); //<-- instead of change()
&#13;
$(function() {
$('[type=range]').on('input', function() {
console.log('range value', this.value);
});
$('[type=text]').on('input', function() {
$('[type=range]').val(this.value).trigger('input');
});
});
&#13;