开发过程中,需要使用JS向页面动态添加radio,实现时通过document.createElement()方法来实现,刚开始的代码如下:
var _radio = document.createElement("input");
_radio.type = "radio";
_radio.name = "_radio";
document.body.appendChild(_radio);
_radio = document.createElement("input");
_radio.type = "radio";
_radio.name = "_radio";
document.body.appendChild(_radio);
结果在IE浏览器上生成的raido无法选中,而使用firefox浏览器却可以选中。后来试了下面的代码:
var _radio = document.createElement("<input type='radio' name='_radio'>");
document.body.appendChild(_radio);
_radio = document.createElement("<input type='radio' name='_radio'>");
document.body.appendChild(_radio);
结果在IE上生成的radio可以选中了,但firefox浏览器中却无效。为此,对于不同的浏览器,需要使用不同的方式来生成radio,这个可以通过判断document是否具有uniqueID属性实现,因为uniqueID是IE特有的属性,为此可以通过下面代码来做到浏览器的兼容性:
if(document.uniqueID) {
//IE浏览器分支
var _radio = document.createElement("<input type='radio' name='_radio'>");
document.body.appendChild(_radio);
_radio = document.createElement("<input type='radio' name='_radio'>");
document.body.appendChild(_radio);
} else {
//非IE浏览器分支
var _radio = document.createElement("input");
_radio.type = "radio";
_radio.name = "_radio";
document.body.appendChild(_radio);
_radio = document.createElement("input");
_radio.type = "radio";
_radio.name = "_radio";
document.body.appendChild(_radio);
}
此外,在IE浏览中,通过document.createElement("input")来生成的radio和checkbox都无法通过document.getElementsByName()方法来获取。
分享到:
相关推荐
`<input type="radio">`和`<label>`的关联是通过`for`属性和`id`属性实现的,这样用户点击`<label>`时,相应的单选按钮会被选中。 最后,关于“Error: Access is denied.”,这通常是由于跨域限制导致的。由于Ajax...
当用户勾选某个复选框并点击“删除”按钮时,JavaScript将遍历表格,查找所有被选中的行(通过检查复选框的checked属性)。找到后,这些行会被从DOM中移除,同时全选复选框的状态也会被更新为未选中。 3. **全选/全...
例如,可以使用`document.createElement()`方法创建元素,然后通过`innerHTML`或`appendChild()`将它们添加到DOM中。这样,我们就能根据需求在运行时动态地生成表格。 接着,实现表格间隔行颜色,可以通过CSS来完成...
使用`document.createElement('option')`创建一个新的`<option>`元素,然后设置其文本和值,最后通过`appendChild`将其添加到选择框中。 ```javascript var select = document.forms[0].elements['location']; ...
console.log("选中了:" + radios[i].value); } } } // HTML <input type="radio" name="gender" value="male" checked> 男 <input type="radio" name="gender" value="female"> 女 ()">检查选择 ``` ####...
在jQuery中,直接使用`$("input[name='metaId']").val()`可能无法获取到被选中的Radio按钮的值,因为它返回的是第一项的值。要获取被选中的Radio按钮的值,可以使用以下两种方法: - `$("input[name='metaId']:...
可以使用 `document.createElement()` 和 `document.createTextNode()` 来创建新的DOM元素和文本节点。 ```javascript var elem = document.createElement("div"); var text = document.createTextNode("新文本"); ...
### JavaScript 常用经验总结 #### 一、概述 JavaScript 是一种广泛应用于网页...熟练掌握这些知识点不仅能够提高编程效率,还能帮助开发者更好地理解和解决实际问题。希望这些内容能对你学习 JavaScript 有所帮助。
首先,HTML部分提供了一个简单的表单结构,包括两个单选按钮(`<input type="radio">`),一个用于表示“无图片”(默认选中),另一个表示“有图片”。当用户选择“有图片”选项时,一个文本输入框(`...
4. **动态创建元素时的Name属性设置**:在使用JavaScript动态创建带有Name属性的HTML元素时,不能直接使用element.name=""来添加Name属性,而必须在创建元素时使用document.createElement('<element name="myName">...
可以使用`document.createElement()`和`document.createTextNode()`创建新的DOM元素和文本节点。 **示例:** ```javascript let p = document.createElement("p"); let text = document.createTextNode("This is ...
jQuery 使用名为 noConflict() 的方法来解决该问题。 var jq=jQuery.noConflict(),帮助您使用自己的名称(比如 jq)来代替 $ 符号。 亲自试一试 结论 由于 jQuery 是为处理 HTML 事件而特别设计的,那么当您遵循...
- **功能**:为选中的元素添加一个或多个类。 - **示例**: ```javascript $("p").addClass("css-style"); ``` #### 设置属性 `attr` - **语法**:`$(selector).attr("attribute", "value")` - **功能**:设置被...