Javascript在下拉更改中设置隐藏的表单值-未从Javascript数组填充的选项

Question

I have some Javascript code that creates 2 arrays: One for Product Category and one for Product. 我有一些Javascript代码可创建2个数组：一个用于产品类别，一个用于产品。

But before the user can choose the Product Category or Product, they have to choose the type of Campaign they wish to use. 但是在用户选择产品类别或产品之前，他们必须选择希望使用的广告系列类型。 Thus, the selection (event) of the 'Campaign', triggers the hidden drop-down menu from which to choose the Product Category. 因此，“广告系列”的选择（事件）会触发隐藏的下拉菜单，从中可以选择产品类别。 Once the Product Category is chosen, the Product drop-down populates and the user is allowed to choose from the appropriate options. 选择“产品类别”后，将填充“产品”下拉列表，并允许用户从适当的选项中进行选择。

My only problem: the Product Category does not populate correctly. 我唯一的问题：产品类别未正确填充。 The options are invisible, but once I select one - the Product options drop-down populates accordingly. 这些选项是不可见的，但是一旦我选择了一个，“产品选项”下拉列表就会相应地填充。 I'm super confused.... 我超级困惑。

Here's the JScript code: 这是JScript代码：

<script type="text/javascript">

var info = new Array(
 "Select One*Select One|Select One",
 "Mortgage*1yr NegAm|3yr ARM|5yr ARM|7yr ARM|15yr FRM|30yr FRM",
 "Home Equity*HELoan|HELOC|Convertible",
 "Credit Card*Standard|Premium|Charge|Limited|Secured|Pre-Paid|Business",
 "Student Loan*Subsidized|Unsubsidized|Undergrad|Graduate|Refi",
 "Auto Loan*Purchase|Lease|Used|Dealer"
);

function stringSplit ( string, delimiter ) { 
    if ( string == null || string == "" ) { 
        return null; 
    } else if ( string.split != null ) { 
        return string.split ( delimiter ); 
    } 
} 

var menu1 = new Array();
var menu2 = new Array();

function createMenus() {

    for ( var i=0; i < info.length; i++ ) {
  menu1[i] = stringSplit ( info[i], '*' );
        menu2[i] = stringSplit ( menu1[i][1], '|' );
    }

 var b = document.selector.dropnum.options[document.selector.dropnum.options.selectedIndex].value;

 var myFormx = myForm + b;

 var prodcat = document.myFormx.main;
    var product = document.myFormx.title;

    prodcat.length = menu1.length;
    product.length = menu2[0].length;  

    for ( var i=0; i < menu1.length; i++ ) {
         prodcat.options[i].value  = menu1[i][0];
         prodcat.options[i].text   = menu1[i][0];
    }
    document.myFormx.main.selected = 0;

    for (var x=0; x < menu2[0].length; x++) {
         product.options[x].text = menu2[0][x];
         product.options[x].value = menu2[0][x];
    }
    document.myFormx.title.selected = 0;
}

function updateMenus ( what ) {
    var sel = what.selectedIndex;

    if ( sel >= 0 && sel < menu1.length ) 
        var temp = menu2[sel];
    else
        var temp = new Array ();

    what.form.title.length = temp.length;

    for ( var i = 0; i < temp.length; i++ ) {
        what.form.title.options[i].text  = temp[i];
        what.form.title.options[i].value = temp[i];
    }
    what.form.title.selected=0;
}
</script>

Here's the code from my .php file: 这是我的.php文件中的代码：

<html>
<body onLoad="createMenus()">

<br>
<br>

<form name="selector" action="#" method="post">       <!-- This is where you add a link to the 'Dials' tab -->
Select the Campaign methodology to model:

<select id='campnum' name='dropnum' class='css_button_example' onChange="javascript: ShowMenu(document.getElementById('campnum').value, 'camp', 5);">
        <option value='0'>Select Campaign
        <option value='1'>Retention Campaign
        <option value='2'>Acquisition Campaign
        <option value='3'>Cross-Sell Campaign
        <option value='4'>Up-Sell Campaign
</select>
</form>

<div name="newboxes" id="camp0" style="display: none;" href="javascript:showonlyone('camp0');">
</div>

<!--*************************************************Retention Campaign************************************************--> 
<div name="newboxes1" id="camp1" style="display: none;" href="javascript:showonlyone('camp1');">
 <form name="myForm1"><p>
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 Product Category:&nbsp;
 <select name="main" size=1 onChange="updateMenus(this)">
 <option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <option>
 <option>
 </select>

 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 Product:&nbsp;
 <select name="title" size=1>
 <option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <option>
 <option>
 </select>
 </form>
</div>

</body>
</html>

Regards, 问候，

Vijay 维杰

Answer 1

"href" attribute on div doesn't make sense: div上的“ href”属性没有意义：

<div href="javascript:showonlyone

And onChange="javascript:..." is wrong -- the value of onchange should be just JS code, no "javascript:" prefix. 并且onChange="javascript:..."是错误的-onchange的值应该只是JS代码，没有“ javascript：”前缀。

Where's ShowMenu defined? ShowMenu在哪里定义？

Javascript在下拉更改中设置隐藏的表单值-未从Javascript数组填充的选项

问题描述

1 个解决方案

解决方案1
2 已采纳 2009-10-24 22:50:01

Javascript在下拉更改中设置隐藏的表单值-未从Javascript数组填充的选项

问题描述

1 个解决方案

解决方案1 2 已采纳 2009-10-24 22:50:01

解决方案1
2 已采纳 2009-10-24 22:50:01