Question

我有三个表单字段：名称，名字和姓氏。名称字段是隐藏的，我正在尝试将值设置为keypress上的firstname + lastname。我也试图将其格式化，以便字符全部为小写，空格转换为破折号。

所以：

<input type="text" name="firstname" value="John John" />
<input type="text" name="lastname" value="Doe" />
<input type="hidden" name="name" value="john-john-doe" />

我一直在尝试使用以下代码，但它无效......

            $('input[name=field_firstname[0][value]]').keyup(function() {
                    var firstname = $('input[name=field_firstname[0][value]]').val();
                    var lastname = $('input[name=field_lastname[0][value]]').val();
                    $('input[name=name]').val(firstname.replace(/\s/g, "-").toLowerCase()+lastname.replace(/\s/g, "-").toLowerCase());
            });

            $('input[name=field_lastname[0][value]]').keyup(function() {
                    var firstname = $('input[name=field_firstname[0][value]]').val();
                    var lastname = $('input[name=field_lastname[0][value]]').val();
                    $('input[name=name]').val(firstname.replace(/\s/g, "-").toLowerCase()+lastname.replace(/\s/g, "-").toLowerCase());
            });

Answer 1

也许我错过了一些上下文，但我认为你不能使用那样的属性选择器。要获取名字字段，您需要说：input[name='firstname']。

你也做了两次同样的事情，这总是一个额外思考的好理由。例如，您可以一次性同时执行keyup个任务：

$("input[name='firstname'], input[name='lastname']").keyup(...);

但是，使用ID可以使事情变得更容易。例如，请使用此HTML：

<input type="text" name="firstname" id="firstname" value="John John" />
<input type="text" name="lastname" id="lastname" value="Doe" />
<input type="hidden" name="name" id="sanitized_name" value="john-john-doe" />

您将使用以下代码snippit：

$('#firstname, #lastname').keyup(function() {
  var fullname = $('#firstname').val() + ' ' + $('#lastname').val();
  $('#sanitized_name').val(fullname.replace(/\s/g, '-').toLowerCase());
});

Answer 2

忽略[0][value]，如：

$('input[name=field_firstname]') // removed [0][value]

不完全确定你为什么把它放在那里。

此外，您可能希望使用.blur()代替.keyup()，从而为您节省大量冗余重复次数。更好的是，将.submit()上的字段连接起来，因为无论如何当你关心它时。想想看，“Jhon Doe”在使用.keyup()和jQuery进程完成时意味着16个查找和8个连接。

<强>附录

现在看到这几次，人们将无效/有问题的字符放在像[0][value]这样的id属性中，这对jQuery是无效的，因为它将它识别为css表达式而不是id的一部分。 document.getElementById( "bla[0]" );似乎确实有效，但如果您真的需要（或者懒得修复它），您可以执行以下操作：

$( document.getElementById( "bla[0][value]" ) ) //etc

JQuery问题 - 将值附加到隐藏的输入字段？

2 个答案: