做了一个计算运费的小应用,当点选地区的时候触发计算函数,计算函数会获取该地区对应的value,最后算出总运费。但当我使用onfocus事件来触发函数的时候,获取到的value是上一次的value,如下图,默认广州(value=1)为checked,当点击上海(value=4)的时候,打印出来的却是1(本应该是4),使用onclick事件或者再点击一次上海就正常(打印出4)了,我的设想是onfocus先于radio的checked,因此第一次点击(focus)上海时触发函数使用广州的value,函数执行后上海再被选中(checked),第二次点击上海执行函数时就使用上一次的value。描述可能不是很清晰,大神们试着输入1.3然后选择上海,出来的结果是6.5(错误),再选择上海才是9.5(正确)。基于这个案例希望大神解释下onfocus在这里的运作原理,能说下onclick和onfocus的区别更佳,现行致谢!
运费计算器
我没有看明白你的意思,但是
1.代码中,fource 的value 不需要用for 去获取,
然后修改 getExFee() 函数 getExFee(obj) 并修改下面代码
region = obj.value;
2,每个 input 里去绑定 onfocus 太麻烦,可以用bind 或类似如下
进行事件绑定
设置checked属性值(默认的行为),在focus事件处理函数处理完之后
getExFee(event)
能获取触发focus事件的DOM元素,进而做相应的逻辑处理focus事件是不支持冒泡的~~~