0

我有一个<div class="foo">Foo</div>，我有两个输入字段：

  1. <input type="submit" class="text_field" name="input_one" value=""> 和
  2. <input type="submit" class="text_field" name="input_two" value="">

我希望能够单击<div>Foo</div>并使用 value 填充字段 #1 并使用 value 填充字段Foo#2 Bar。（推断这个想法以合并许多不同的 div，因此，许多不同的值组合。）我怎样才能最好地使用 jQuery 做到这一点？

到目前为止，我可以毫不费力地做类似的事情：

jQuery(function () {
$('div.foo').click(function (e) {

    var foo = $(this).text();

    $("input.text_field").val(foo);
});
});​

这适用于单击 div 并使用标签之间的文本值填充一个文本字段，即“Foo”。这是一个好的开始……但由于我是新手，我想知道如何最好地用两个不同的值“Foo”和“Bar”填充两个不同的文本字段。有没有办法name="Bar"在 div 上设置 a 或其他东西，然后访问该名称值以插入第二个文本字段input_two？感谢您的想法，评论，考虑，谢谢！

4

2 回答 2

1

这是一个奇怪的问题，你能解释一下你需要做什么吗？我的意思是，您发布了您想做的事情，但是您为什么要这样做？不清楚 Bar 和 Foo 是什么，是每次提交的预定义值吗？值是否取决于 div（假设您有多个 div，并且您需要根据单击的 div 填充输入）

您可以将任何属性放在您需要的任何标签上，并使用 $([selector]).attr('attr_name') 来获取值，html5 定义了一些“数据-”属性来存储类似http:// html5doctor.com/html5-custom-data-attributes/

编辑：你可以有类似的东西

<div class='clickeable' data-input1='foo' data-input2='bar'></div>
<div class='clickeable' data-input1='baz' data-input2='xxx'></div>

和js

$('.clickeable').click(function(){
  obj = $(this);
  $('input[name=input_1]').val(obj.attr('data-input1'));
  $('input[name=input_2]').val(obj.attr('data-input2'));
})

然后 js 是通用的，您可以添加任意数量的 div 任何值

于 2012-10-06T03:50:44.580 回答
0

使用 ID 选择器： http ://api.jquery.com/id-selector/

<div class="foo">

    <input type="submit" id="one" class="text_field" name="input_one" value=""> 
    <input type="submit" id="two" class="text_field" name="input_two" value="">
</div> 


jQuery(function () {
$('div.foo').click(function (e) {    
    var foo = $(this).text();    
    $("#one").val(foo);
    $("#two").val("Bar");
});
});​
于 2012-10-06T03:44:46.683 回答