数据属性到字段值

时间:2015-07-01 08:54:13

标签: jquery

我正在努力通过点击链接将数据 - 属性添加到表单的输入中。如果我点击另一个链接,那么以前的值应该替换为与此链接相关的新值。

这是我的链接代码:

<div id="links">
<h3>Links</h3>
<a href="#1" data-url="http://apple.com" data-name="My url">Link 1</a>
<a href="#2" data-url="http://bbc.co.uk" data-name="My second url">Link 2</a>
<a href="#3" data-url="http://google.com" data-name="My third url">Link 3</a>
</div>

这是我的表格代码:

<div id="form">
<h3>Form</h3>
<input type="text" size="25" value="">
<input type="hidden" name="" value="">
</div>

所以我只有一个表单来提供所有链接(总共可能超过100个)。

请在此处查看我的JSFIDDLE:http://jsfiddle.net/jtzrjrs2/1/

我非常感谢你的帮助。

1 个答案:

答案 0 :(得分:1)

您当前的代码,注释:

$

你可能想要更像这样的东西:

$('#links a').click(function(){    // when I click an 'a' element within the element with ID 'links'
    $(this).find('input').val();   //find any inputs contained within the clicked item, and get the value of the input
});

JSFIDDLE

<强>更新

要在输入中设置单独的值,此解决方案应该有效:

$('#links a').click(function(){                           // when I click an 'a' element within the element with ID 'links'
    $('#form').find('input').val($(this).data('name'));   // find any inputs within the elmeent with id 'form', and set its value to be the 'data-name' attribute of the item I clicked
});

JSFIDDLE