Question

学习jquery，在chrome控制台中创建表单：

$('#form1').submit(function(e) {
    e.preventDefault();
    $('#form1 input, #form1 select').each(function(index){
        var input = $(this);
        console.log('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    });
});

然后尝试在表单提交期间访问字段：这有效：

＆＃13;

$($form1).submit(function(e) {
    e.preventDefault();
    $($form1).each(function(index){
        var input = $(this);
        console.log('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    });
});

＆＃13;

＆＃13; 输出：键入：textName：name1Value：hello world 键入：submitName：submit1Value：submit

但这不是：

＆＃13;

div

＆＃13;

＆＃13; 输出：键入：undefinedName：undefinedValue：

如何使用变量$ form1而不是实际元素#form1访问表单字段？

感谢您的回答。

Answer 1

您可以使用children和选择器来过滤所需的选项。

var $div1 = $('body');
var $form1 = $("<form>", { id: 'form1' });
$div1.append($form1);

$form1.append('<input name="test" type="text"/> <input value="go" name="whattodo" type="submit" />');


$($form1).submit(function(e) {
    e.preventDefault();
    $form1.children('input').each(function(index){
        var input = $(this);
        console.log('Type: ' + input.attr('type') + ' Name: ' + input.attr('name') + ' Value: ' + input.val());
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如何使用表单的变量引用访问jquery中的表单字段？

1 个答案: