2012-11-26 231 views
-3

我需要一个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> 

前场的数值将被自动输入,因为后者字段的值。这就是我想要在这里做的。

+0

没有。我只有html。我需要整个脚本。可能只是沿着生成该表单的页面加载它。 – xchampionx

+0

您是否期望SO上的某个人能够编码并为您提供整个脚本?我们都得到我们的工作需要支付我们的账单支付。请拿出一个特定的程序员问题或聘请开发人员。 – feeela

+0

嗯,只是帮助我开始。这只是一个领域,所以我只能想象10,20行js代码?但是,我又是一个noob。哦,好吧...... – xchampionx

回答

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); 
    };) 
} 

希望这有助于。

+0

需要jQuery,我不认为OP知道这一点。 – Christophe

+0

哦..是的..可能是我应该提到的。 :d –

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属性中使用“ - ”。

P.S .:正如其他人指出的,这个论坛的目的是帮助你,而不是为你做所有的工作。

相关问题