Question

我需要一个基于HTML代码的javascript源代码的下拉列表。

我有一个代码，但它基于html下拉列表，但我需要一个javascript。

我参与了一个代码，我在下面分享它。

样品：

function runList(){
  var select = document.getElementById('custom_state');
  select.options[select.options.length] = new Option('Adres 1', 'Adres 1');
  select.options[select.options.length] = new Option('Adres 2', 'Adres 2');
  select.options[select.options.length] = new Option('Adres 3', 'Adres 3');
  select.options[select.options.length] = new Option('Adres 4', 'Adres 4');
}
var datafield;
function getQuerystring(key)
{
    var work = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regex = new RegExp("[\\?&]"+work+"=([^&#]*)");
    var qs = regex.exec(window.location.href);
    if (qs == null) return null;
    return qs[1];
}

function IsOptionInDropDown(value)
{
    switch (value) {
        case "d.c.": value="dc";
            break;
        default:
            break;
    }
    var lvalue=value.toLowerCase();
    
    var dropdown = document.getElementById("custom_state");
    var options = dropdown.options;
    var i = 0;
    for(i=0;i<options .length;i++)
    {
        if (options[i].value.toLowerCase() == lvalue || options[i].text.toLowerCase() == lvalue)
        {
            dropdown.value = options[i].value;
            SetOtherVisible(false);
            return true;
        }
    }
    return false;
}

function DropDownChanged(value)
{
    if (value !== null && value!=="") {
        if (value.charAt(0)=='!') {
            StateChanged("");
            return;
        }
        if (value=="other") {
            SetOtherVisible(true);
            return;
        } else {
            SetOtherVisible(false);
        }
        var os = document.getElementById("other_state");
        os.value = value;
        StateChanged(value);
    }
}

function TextBoxChanged(value)
{
    StateChanged(value);
    IsOptionInDropDown(value);
    return true;
}

function StateChanged(value)
{
    datafield.setValue(value);
}

function SetOtherVisible(visibility)
{
    var ddcell = document.getElementById("cell_dd");
    var textcell = document.getElementById("cell_tb");
    if (visibility) {
        ddcell.style.width="50%";
        textcell.style.display="table-cell";
        textcell.style.width="50%";
    } else {
        textcell.style.display="none";
        ddcell.style.width="100%";
        textcell.style.width="100%";
    }
}

<meta charset="utf-8">
</head>
    <body onload="runList()">
        <form name="myform" action="" method="GET">
    <table width="100%" cellspacing="0" cellpadding="0">
    <tbody>
    <tr>
        <td id="cell_dd">
<select name="custom_state" class="ms-crm-SelectBox" id="custom_state" style="width: 100%; -ms-ime-mode: auto;" onchange="DropDownChanged(this.value)" req="2" height="4">


</select>
</td>
    <td id="cell_tb" style="padding-left: 15px; display: none;">
<input class="ms-crm-Text" id="other_state" style="width: 100%; -ms-ime-mode: auto;" onchange="TextBoxChanged(this.value);" type="text" maxlength="50" req="0">
</td>
    </tr>
</tbody>
    </table>
</form>
    </body>

Answer 1

喜欢这个？

＆＃13;

var ddl = $("<select></select>");

for(var i=1; i<=10;i++)
  {
    
    ddl.append('<option value="'+i+'">Option '+i+'</option>');
  }



$("#ddContainer").append(ddl);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="ddContainer">
  
  </div>

＆＃13;

html源代码中的Javascript下拉列表

1 个答案: