如何创建“动态组合框”而不是“选择-HTML中的选项标签”

时间:2019-04-22 08:07:21

标签: javascript dhtml

我目前正在研究如何制作一个SELECT-OPTION标签,该标签可以添加新值而无需通过硬编码添加,我发现我们实际上可以使用DHTML属性使用“动态COMBO BOX”。

我已经尝试过使用此链接==> http://jkorpela.fi/forms/combo.html


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<TITLE>Combo box demo</TITLE>
<script type="text/javascript" language="JavaScript"><!--
function activate(field) {
  field.disabled=false;
  if(document.styleSheets)field.style.visibility  = 'visible';
  field.focus(); }
function last_choice(selection) {
  return selection.selectedIndex==selection.length - 1; }
function process_choice(selection,textfield) {
  if(last_choice(selection)) {
    activate(textfield); }
  else {
    textfield.disabled = true;    
    if(document.styleSheets)textfield.style.visibility  = 'hidden';
    textfield.value = ''; }}
function valid(menu,txt) {
  if(menu.selectedIndex == 0) {
    alert('You must make a selection from the menu');
    return false;} 
  if(txt.value == '') {
    if(last_choice(menu)) {
      alert('You need to type your choice into the text box');
      return false; }
    else {
      return true; }}
  else {
    if(!last_choice(menu)) {
      alert('Incompatible selection');
      return false; }
    else {
      return true; }}}
function check_choice() {
  if(!last_choice(document.demoform.menu)) {
    document.demoform.choicetext.blur();
    alert('Please check your menu selection first');
    document.demoform.menu.focus(); }}
//--></script>

<form action="add_file.php" name="demoform" onsubmit=
 "return valid(this.menu,this.choicetext)">
<select name="menu" onchange=
 "process_choice(this,document.demoform.choicetext)">
<option value="0" selected>(please select:)</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="other">other, please specify:</option>
</select>
<noscript>
<input type="text" name="choicetext">
</noscript>

<script type="text/javascript" language="JavaScript"><!--
disa = ' disabled';
if(last_choice(document.demoform.menu)) disa = '';
document.write('<input type="text" name="choicetext"'+disa+
' onfocus="check_choice()">');
if(disa && document.styleSheets)
   document.demoform.choicetext.style.visibility  = 'hidden';
//--></script>

<p>
<input type="submit">
</form>

它最终仅显示value =“ other”而不是单击提交并保存到数据库后输入的新文本。任何可能的帮助都深表感谢。在此先感谢!

0 个答案:

没有答案