Jquery获取表单中所有无线电/复选框的HTML代码

jquery get the html code for all radios/checkboxes within a form

本文关键字：复选框 HTML 代码 无线电 获取 表单 Jquery      更新时间：2023-09-26

我正在尝试解析表单的一些元素。

我有我的表单ID/表单名称。

现在我要解析所有name= "radio123"(或id="radio123")的单选按钮。但是，当我尝试$(this).html对每个元素(单选按钮)…然后我得到一个空白值…

如何访问表单中所有单选按钮/复选框的HTML代码?

这是jQuery.fn.html函数的正常行为:This method uses the browser's innerHTML property.如果您不明白我的意思，请查看示例。

我不知道你为什么要得到HTML(如果你想要的值，看看jQuery.fn.val方法)，但这里有一个解决方案

$("input:radio").each(function () {
   console.log( this.outerHTML );
});

小心使用outerHTML，因为它不是所有浏览器都支持的。你可以使用这个函数:

function getOuterHTML( node ) {
    var parent = node.parentNode,
        el = document.createElement( parent.tagName ),
        shtml;
    el.appendChild( node );
    shtml = el.innerHTML;
    parent.appendChild( node );
    return shtml;
}
// use it like getOuterHTML( this ) in the preceding each loop

这样就可以了-

var htmlarr = [];
$("input[type='radio'][name='radio123'],[type='radio'][id='radio123']").each(function () {
   //any logic you need here
   htmlarr.push($(this).clone().wrap('<div>').parent().html());
})

Demo - http://jsfiddle.net/tJ2Zc/

代码使用$(this).clone().wrap('<div>').parent().html()方法获取DOM元素的外部HTML。更多信息可以在问题中找到-获取选定元素的外部HTML

上面的代码将所有的单选按钮html写入一个数组，但是你可以在循环中修改它来做你想做的事情。

相关文章：