根据下拉菜单填充相邻表列OnChange

时间:2012-12-19 19:08:46

标签: drop-down-menu menu html-table onchange

我正在创建一个包含商店的照片库网站。我的编程经验相当有限,但在过去的几个月里,我已经对HTML和PHP有了很好的掌握。我尝试创建一个允许用户从下拉菜单中选择产品规格的表格。选择后,理想情况下,产品的价格将显示在相邻列中。如果用户从下拉菜单中更改其选择,则此价格应该会更改。在将价格输出到屏幕时,我完全迷失了。出于测试目的,我已经包含了一个警报,它会创建一个弹出窗口,以确保价格正在改变。这就是我到目前为止......

     <TD>
     <select id="photo" onchange="price(this.value)">
            <option value="$">--Please Select--</option>
            <option value="$2.50">6" X 12" - $2.50</option>
            <option value="$3.50">6" X 18" - $3.75</option>
            <option value="$5.00">6" X 24" - $5.00</option>
    </select>
    </TD>
    <TD>
    <script>
         function price(data)
           {
              value=data;
              alert(value);
           }

    </script>
    </TD>

1 个答案:

答案 0 :(得分:0)

移动您的脚本,使其位于HTML文档的head标记之间,并将其更改为以下内容:

<script type="text/javascript">
    function price(data)
    {
        var myDiv = document.getElementById( "itemPrice" );
        myDiv.innerHTML = data;
    }
</script>

然后更改第二个&lt; TD&gt;的内容。阻止这个:

<td>
     <div id="itemPrice" name="itemPrice">
         Price will go here on selection
     </div>
</td>

应该做的伎俩