0

さまざまな選択肢に対して別のオプションを表示したいと思います。

  • MenuNo1 (textinput)どちらかが等しい場合-1,2,3,4 or 5の値は であるmenuPrice1必要がありますR70.00。
  • MenuNo1(textinput)どちらかが等しい場合-8,9,12の値は であるmenuPrice1必要がありますR85.00。
  • MenuNo1 (textinput)等しい場合-11の値は にmenuPrice1なりますR105.00。

私はこのようにしてみました:しかし、MenuPrice1フィールドには何も表示されませんか? コンソールにもエラーはありません。

function calcMenu(form) {
    var MenuPrice1 = (+form.MenuPrice1.value);
    var MenuNo1 = (+form.MenuNo1.value);

    if ([1,2,3,4,5].indexOf(+form.MenuNo1.value) != -1) {
        MenuPrice1.value = "70";
    } 
    else if ([8,9,12].indexOf(+form.MenuNo1.value) != -1) {
        MenuPrice1.value = "85";
    }
    else if (+form.MenuNo1.value == 11)  {
        MenuPrice1.value = "105";
   } 
}

HTML

<form id="quote" action="" method="get">
    <script type="text/javascript">
        // <![CDATA[
        jQuery(document).ready(function($) {
            jQuery('#quote').change(function() {
                doTotal(this)
            });
        });
        // ]]>
    </script>
    <script type="text/javascript">
        // <![CDATA[
        jQuery(document).ready(function($) {
            jQuery('#quote').change(function() {
                calcMenu(this)
            });
        });
        // ]]>
    </script>
    <table width="532" border="1" cellspacing="1" cellpadding="0.5">
        <tbody>
            <tr>
                <th scope="col" width="70">
                <div align="center">
                    Date
                </div></th>
                <th scope="col" width="158">
                <div align="center">
                    Amount of Delegates ½ Day Conference @ R 240 pp
                </div></th>
                <th width="112">
                <div align="center">
                    Amount of Delegates Full Day Conference @ R 260 pp
                </div></th>
                <th width="112">
                <div align="center">
                    Menu No
                </div></th>
                <th width="112">
                <div align="center">
                    Price pp for Menu (1-7: R70, 8-10 R85, 11: R105, 12: R85)
                </div></th>
                <th width="134">
                <div align="center">
                    Total for the day
                </div></th>
            </tr>
            <tr>
                <td>
                <div align="center">
                    <input type="text" name="date1" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="halfday1" size="15" maxlength="10" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="fullday1" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuNo1" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuPrice1" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="total1" size="15" />
                </div></td>
            </tr>
            <tr>
                <td>
                <div align="center">
                    <input type="text" name="date2" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="halfday2" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="fullday2" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuNo2" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuPrice2" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="total2" size="15" />
                </div></td>
            </tr>
            <tr>
                <td>
                <div align="center">
                    <input type="text" name="date3" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="halfday3" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="fullday3" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuNo3" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="MenuPrice3" size="15" />
                </div></td>
                <td>
                <div align="center">
                    <input type="text" name="total3" size="15" />
                </div></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
    </table>
</form>
4

1 に答える 1

3

あなたは持っていて、後でvar MenuPrice1 = (+form.MenuPrice1.value);やっています。MenuPrice1.value =

また、これを行うためのよりクリーンな方法もあり、将来のメンテナンスも容易になります。

フィドル: http://jsfiddle.net/8q7Fh/3

var prices = [
    {
        values: [1,2,3,4,5],
        price: 'R70.00'
    },
    {
        values: [8,9,12],
        price: 'R85.00'
    },
    {
        values: [11],
        price: 'R105.00'
    }
];

function calcMenu(form)
{
    var i, searchValue = parseInt(form.MenuNo1.value);
    form.MenuPrice1.value = '';

    for (i in prices)
    {
        if ($.inArray(searchValue, prices[i].values) != -1)
        {
            form.MenuPrice1.value = prices[i].price;
        }
    }
}

注:現在、値が 6、7、および 10 の場合の価格がありません。現時点では、明確な価格が見つからない場合は MenuPrice の値をクリアするように設定しています。考えるべきこと！

于 2013-04-16T19:42:08.667 に答える