Question

我正在寻找一种安全的方法来获取所选单选按钮的值：

我不知道表单ID
我不知道我的页面中有多少相似（不包括ID）表单

我目前正在使用这个：

if (($(elem).is('input[type="radio"]')) && ($(elem).attr('name') !== undefined)) {
    return $('input[name="' + $(elem).attr('name') + '"]:checked').val();
}

但是如果我有不同形式的相似名字，这就行不通了，我甚至不知道将这样的东西放在选择器上是否安全。

我的目标是创建一个getValue()函数，该函数返回一个元素（$(elem).length == 1）的值而不属于自然界：

var getValue = function(elem) {
    if ($(elem).is('input[type="checkbox"]')) {
        return ($(elem).prop('checked') == true);
    }
    else if (($(elem).is('input[type="radio"]')) && ($(elem).attr('name') !== undefined)) {
        return $('input[name="' + $(elem).attr('name') + '"]:checked').val();
    }
    else if ($(elem).prop('value') !== undefined) {
        return $(elem).val();
    } else {
        return $(elem).html();
    }
}

有什么建议吗？

Answer 1

您可以使用jquery以更省力的方式获取值。 jquery中有很好的范围选择器，您可以使用它们来选择按钮。例如

$("#some_div #inside_div formelement").val();

您必须知道的是至少一个父容器ID。

Answer 2

我找到了一个解决方案，使用this answer：

// Get selector from any dom element
// @see https://stackoverflow.com/a/2068381/731138
var getPath = function(elem) {
    var path;
    var node = $(elem);
    while (node.length) {
        var realNode = node[0];
        var name = realNode.localName;
        if (!name) {
            break;
        }
        name = name.toLowerCase();
        if (realNode.id) {
            return name + '#' + realNode.id + (path ? '>' + path : '');
        } else if (realNode.className) {
            name += '.' + realNode.className.split(/\s+/).join('.');
        }
        var parent = node.parent();
        var siblings = parent.children(name);
        if (siblings.length > 1) {
            name += ':eq(' + siblings.index(node) + ')';
        }
        path = name + (path ? '>' + path : '');
        node = parent;
    }
    return path;
}

// Return value of any element without knowledge of its type
var getValue = function(elem, contextSelector) {
    if ($(elem).is('input[type="checkbox"]')) {
        return ($(elem).prop('checked') == true);
    }
    if (($(elem).is('input[type="radio"]')) && ($(elem).attr('name') !== undefined)) {
        return $(contextSelector + '>input[name="' + $(elem).attr('name') + '"]:checked').val();
    }
    if ($(elem).prop('value') !== undefined) {
        return $(elem).val();
    } else {
        return $(elem).html();
    }
}

然后，当我需要恢复要从任何选择器发布的字段时，这看起来像：

// Get all data to post
var elemSelector = getPath(elem);
var inputSelector = $(elem).data('input');
var inputData = {};
if (inputSelector !== undefined) {
    if (inputSelector !== '') {
        inputSelector = inputSelector + ' :input';
        $.each($(inputSelector), function (index, node) {
            if (($(node).attr('name') === undefined) && ($(node).attr('id') === undefined)) {
                return true;
            }
            var key = $(node).attr('name');
            if (key === undefined) {
                key = $(node).attr('id');
            }
            inputData[key] = getValue(node, elemSelector);
        });
    } else {
        inputData['value'] = getValue(elem, elemSelector);
    }
}

在不知道表单ID的情况下获取所选单选按钮的值，也不知道页面中有多少表单

2 个答案: