-4

我需要一个 JavaScript，它可以让我根据另一个选择列表类型的字段自动填充文本字段。

这是我的 HTML 标记：

<div class="attribute-16 even"><div id="edit-attributes-16-wrapper" class="form-item">
 <label for="edit-attributes-16">Position: <span class="form-required">*</span></label>
 <select id="edit-attributes-16" class="form-select required" name="attributes[16]"><option selected="selected" value="">Please select</option><option value="32">Content</option><option value="33">Footer</option></select>
</div> </div>

<div class="attribute-17 odd"><div id="edit-attributes-17-wrapper" class="form-item">
 <label for="edit-attributes-17">Anchor Text: <span class="form-required">*</span>: </label>
 <input type="text" class="form-text attribute" value="" size="60" id="edit-attributes-17" name="attributes[17]" maxlength="128">
</div> </div>

前一个字段的值将自动输入为后一个字段的值。这就是我想在这里做的。

4

2 回答 2

1

您必须将事件侦听器添加到您的选择字段并将其值填充到您的文本字段中。你的 HTML 有点乱。所以我一般只写 jquery。你可以摆弄它。

您必须在加载正文后立即设置此事件侦听器。所以在你的 HTML

<body onload="init()" id="stage" class="theme">

在你的 javascript 上

function init() {
   $("#selectListID").on("change", function(){
      var value = $(this).val();
      $("#inputFieldID").val(value);
   };)
}

希望这可以帮助。

于 2012-11-26T18:49:23.197 回答
0 
<label for="edit-attributes-16">Position: <span class="form-required">*</span></label>
<select id="edit-attributes-16" class="form-select required" name="attributes[16]" onchange="document.getElementById('attributes-16-text').innerHTML=document.getElementById('edit-attributes-16').value;">
<option selected="selected" value="">Please select</option><option value="32">Content</option>
<option value="33">Footer</option>
</select>
<div id="attributes-16-text"> </div>

现场演示：http: //jsfiddle.net/C7pnj/1/

关键是使用onchange 事件处理程序来检测用户操作。

我还建议避免在 id 属性中使用“-”。

PS：正如其他人所指出的，这个论坛的目的是帮助你，而不是为你做所有的工作。

于 2012-11-26T18:50:34.983 回答