Question

背景我有一个PHP从我的数据库生成的表单。该页面是晚宴活动的座位登记。每张[晚餐]餐桌都会收到一定数量的前台门票。例如，一张10个座位的桌子，可能有7张晚会门票和3张主席接待门票。

每一行都有一个前缀值，用于存储数组中的前缀，我循环这些前缀以获取我的值。看起来像：

<select name='prefix[]'  onchange='prefixCheck(this.value)' >
    <option value=''>Select</option>
    <option value='Mr.'selected >Mr.</option>
    <option value='Ms.' >Ms.</option>
    <option value='Dr.' >Dr.</option>
    <option value='Sen.' >Sen.</option>
    <option value='Sec.' >Sec.</option>
    <option value='Rep.' >Rep.</option>
</select>

我的表单上会有不同数量的prefix[]字段。我的页面顶部还有一张桌子上有多少晚会和主席接待门票的柜台：

<td align = left>
    Total Gala Reception Tickets Available:
</td>
<td align = center>
    <input  type='text' size='2' id='gala' name='gala' value=7 style='background-color:#C8C8C8  '>
    <input  type='hidden' size='2' id='gala_orig' name='gala' value=7 >
</td>
 </tr>
 <tr>
    <td align = left>
        Total Chairman's Reception Tickets Available
    </td>
    <td align = center>
        <input type='text' id='chairman' name='chairman' size='2' value=3 style='background-color:#C8C8C8  '>
        <input type='hidden' id='chairman_orig' name='chairman' size='2' value=3 >
    </td>
 </tr>

目标 Sen.，Sec.，Rep.的前缀值是特殊的，这意味着如果用户为每个席位选择其中任何一个，我希望gala的计数减少，以及chairman递增的数字。我有这个javascript函数，但我似乎是一个关键的部分。如果用户选择Sen.，则会发生操作，但如果他们选择了另一个限定前缀，则操作会再次发生;减少晚会，增加椅子。

function prefixCheck(v){
                gala_limit = document.getElementById('gala').value;
                chair_limit = document.getElementById('chairman').value;

                if(v == 'Sec.' || v == 'Sen.' || v == 'Rep.'){
                    gala_limit--;
                    chair_limit++;

                    document.getElementById('gala').value = gala_limit;
                    document.getElementById('chairman').value = chair_limit;
                }
                else{
                    document.getElementById('gala').value = document.getElementById('gala_orig').value;
                    document.getElementById('chairman').value = document.getElementById('chair_orig').value
                }

            }

我不想更改prefix数组的对象结构。我错过了什么？

Answer 1

您的prefixCheck函数没有足够的信息来执行此操作。

至关重要的是，如果chair_limit计数目前大于零，那是因为当前一位或多位客人有资格获得主席的接待。因此，当选择前缀时，如果前缀符合，则应仅增加chair_limit，如果前一个前缀不符合，则应增加。正如您非常正确地指出的那样，从Sen.切换到Sec.不应该改变任何一个计数。

然而，prefixCheck函数目前没有足够的信息来进行区分。如果您将旧值和旧值作为参数传递，则它将能够正确执行计算。

（并且不要忘记实施硬币的另一面 - 也就是说，如果有人从例如{{1}切换到减少 chair_limit并增加gala_limit转到Sec.）

Answer 2

您未执行的操作是跟踪可能已选择的先前值。但是，您可以轻松更改代码：

将'prefixCheck(this.value)更改为'prefixCheck(this)以传递对元素本身的引用。
稍微改变你的功能：

function prefixCheck(v)
{//v is now a reference to the changed elem:
    var wasSpecial = elem.oldValue || '';//if nothing was selected, it wasn't a special guest before
    //don't use globals, use var inside functions
    var gala_limit = document.getElementById('gala').value;
    var chair_limit = document.getElementById('chairman').value;
    if(v.value == 'Sec.' || v.value == 'Sen.' || v.value == 'Rep.')
    {
        if (wasSpecial === '')
        {
            gala_limit--;
            chair_limit++;
            if (gala_limit < 0)
            {
                alert ('No room for you '+ v.value);
            }
        }
        document.getElementById('gala').value = gala_limit;
        document.getElementById('chairman').value = chair_limit;
        v.oldValue = 'yes';//set some oldValue property, to mark that this element has been set to a special guest value
    }
    else
    {
        if (wasSpecial !== '')
        {
            document.getElementById('gala').value = ++gala_limit;
            document.getElementById('chairman').value = --chair_limit;
        }
        if (chair_limit < 0)
        {
            alert('erm... no more chairs?');
        }
        v.oldValue = '';//always set your oldValue to mark a non special value was selected
        //I see no real reason why you should reset your counters here, but you can
        //Though I'd suggest just setting the #gala and #chairman elements when the page loads and keep using the values herein.
        //document.getElementById('gala').value = document.getElementById('gala_orig').value;
        //document.getElementById('chairman').value = document.getElementById('chair_orig').value
    }
}

您还可以将事件本身传递给函数prefixCheck(this,event)，而不是警报，捕获它（e.preventDefault()或e.returnValue = false）。
另一件事：代替if ((v.value === 'Sen.'....正则表达式v.value.match(/^[SR]e[cnp]\.$/甚至更好：if (v.value.charAt(1) === 'e'也可以正常工作，更具可读性......

虽然我不确定这会回答你的问题，但我希望它至少有用处。

智能地增加/减少值

2 个答案: