JSON格式的影响 及 label 嵌套radio的问题

本文介绍了在IE7浏览器中遇到的JS兼容性问题及解决方案,主要原因是JSON格式的最后一个逗号未正确注释导致。同时分享了一个关于label元素在IE6中的兼容性修复案例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天接到问题,说一个页面JS效果在IE7中失效了。

 

先去看了下页面,FF和CHROME中是正常的,IE中却没反应。很奇怪,因为这段JS是在JQuery的基础上写的,按说JQ的兼容性很好啊,那么是哪里出了问题呢?

 

想了想也没有头绪,无意中瞟了一眼那个JS文件,发现有段代码被注释掉了,正好是JSON格式的一段。

平时很注意JSON格式的“,”,因为这里最容易出问题。仔细一看,果然,最后一个“,”没有注释掉,赶快改过来,SVN UP后,一切恢复正常。

 

事后又试了一下,总结如下:

JSON格式的代码格式如

json = { a: 1, b : 2, c:3 }

内容用“,”分开,最后一个不应该有“,”如果在这上面有错误的话,在IE6,IE7中会报脚本错误的提示并无法运行,但IE8和FF却默认为正常,^_^

 

 

 

遇到另一个问题类似这样子:

<label >

<input type="radio" value="a"  />

</label>

当你点击label时radio就被选中了,但后来发现在IE6中不行(万恶的IE6啊!)
只有给label加上FOR时才能在IE6中有效,但因为是程序读出来的,没有name或者ID,所以不行。
没办法,只好把input 的click事件写在了label里,并在JS中调整IE6的这个问题,这次天下终于太平了。。。
Vue: ',' expected.这是源代码<template> <div style="margin: 20px auto; width: 80%"> <div class="card"> <div style="font-size: 20px; font-weight: bold; margin-bottom: 20px">账户充值</div> <el-form :model="form" label-width="100px"> <el-form-item label="当前余额"> <span style="color: #ff5000; font-weight: bold">¥{{ formatBalance(user.balance) }}</span> </el-form-item> <el-form-item label="充值金额" required> <el-input-number v-model="form.amount" :min="1" :step="100" controls-position="right" ></el-input-number> </el-form-item> <el-form-item label="支付方式" required> <el-radio-group v-model="form.paymentMethod"> <el-radio label="alipay">支付宝</el-radio> <el-radio label="wechat">微信支付</el-radio> <el-radio label="bank">银行卡</el-radio> </el-radio-group> </el-form-item> <el-form-item> <el-button type="primary" @click="submit">确认支付</el-button> </el-form-item> </el-form> </div> </div> </template> <script setup> import { ref, reactive } from 'vue' import request from '@/utils/request.js' import { ElMessage } from 'element-plus' import { useRouter } from 'vue-router' const router = useRouter() // 修复1: 补充右括号 const user = ref(JSON.parse(localStorage.getItem('xm-user') || '{}')) // 修复2: 增强数值转换 const formatBalance = (balance) => { if (balance === null || balance === undefined) return '0.00' // 移除非数字字符再转换 const cleanValue = String(balance).replace(/[^\d.-]/g, '') const num = parseFloat(cleanValue) || 0 return num.toFixed(2) } const form = reactive({ amount: 100, paymentMethod: 'alipay' }) const submit = () => { if (!form.amount || form.amount <= 0) { ElMessage.warning('请输入充值金额') return } request.post('/user/recharge', { userId: user.value.id, amount: form.amount }).then(res => { if (res.code === '200') { ElMessage.success('充值成功') request.get('/user/info').then(res => { if (res.code === '200') { localStorage.setItem('xm-user', JSON.stringify(res.data)) user.value = res.data router.push('/front/home') } }) } else { ElMessage.error(res.msg) } }) } </script>
最新发布
08-10
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值