2012-11-26 167 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 .:正如其他人指出的,這個論壇的目的是幫助你,而不是爲你做所有的工作。

相關問題