way.js 不和vue.js一样,vue操作是的是虚拟DOM,way直接操作实际DOM,因而直接用jquery的选择器设置获取值。
github上例子很多
//电商含运费成本计算器
<script type="text/javascript">
$(function () {
way.clear();//不需要存储功能
way.watchAll(function (selector, value) {//双向绑定
$('#result').text(function () {
var strs = new Array();
strs = $('#postage').val().split("+");
return Math.round(parseFloat($('#prince').val()) + (Math.ceil($('#weight').val()) - 1) * parseFloat(strs[1])
+ parseFloat(strs[0]) + parseFloat($('#gift').val()));
});
});
});
</script>
<form way-data="myForm" way-persistent="true" class="form-inline">
<p>
<span style=" font-size: 18px">进价</span><input type="text" name="prince" id="prince"
class="form-control input-lg"
style="width: 120px">
<span style=" font-size: 18px">重量</span><input type="text" name="weight" id="weight"
class="form-control input-lg"
style="width: 120px">
<span style=" font-size: 18px">邮费</span> <input type="text" name="postage" id="postage"
class="form-control input-lg" style="width: 140px">
</p>
<p>
<span style=" font-size: 18px">赠品</span><input type="text" name="gift" id="gift" class="form-control input-lg"
style="width: 120px">
<span style=" font-size: 18px">售价</span><input type="text" name="sale" id="sale" class="form-control input-lg"
style="width: 120px">
</p>
</form>
<hr>
<p>
<p><span style="font-weight: bold; color: red;font-size: 24px">成本价:<span id="result"></span></span></p>