5

これはおそらく最もよく聞かれる質問であることは知っていますが、ネットを精査していくつかの例を試しましたが、どれもうまくいきませんでした。これが私の問題です。

まず、TR TD 構造を制御できず、DIV を使用できません。

選択ドロップダウン メニューの値に基づいて、特定の TD を表示できるようにする必要があります。「to」、「to_field」、「from」、「from_field」を使用している4つの異なるIDがあります。私が示したスクリプトは機能していません。誰かが私を助けることができますか？

例: 誰かがドロップダウンで「使用中」を選択した場合、「from」と「from_field」を持つすべての elementID のみを表示したいだけです。誰かが別の値を選択した場合は、それを変更したいと思います。

        <script type="text/javascript">
        function showstuff(element){
            document.getElementById("from").style.display = element=="in_use"?"visibility":"visible";
            document.getElementById("to").style.display = element=="in_use"?"visibility":"hidden";
            document.getElementById("from_field").style.display = element=="in_use"?"visibility":"visible";
            document.getElementById("to_field").style.display = element=="in_use"?"visibility":"hidden";

            document.getElementById("from").style.display = element=="relocated"?"visibility":"visible";
            document.getElementById("to").style.display = element=="relocated"?"visibility":"visible";
            document.getElementById("from_field").style.display = element=="relocated"?"visibility":"visible";
            document.getElementById("to_field").style.display = element=="relocated"?"visibility":"visible";
        }
        </script>
        <table>
            <tr>
                <td><h2>Add/Edit Parts</h2></td>
            </tr>
        </table>
        <form action="includes/inventory_parts.php" method="post" name="myform">
        <table cellpadding="10" style="border:solid 1px #000000">
            <tr>
                <td colspan="20"><h3>Add New Part</h3></td>
            </tr>
            <tr>
                <td style="font-weight:bold">Printer Man Part#</td>
                <td style="font-weight:bold">Part#</td>
                <td style="font-weight:bold">Title</td>
                <td style="font-weight:bold">Serial#</td>
                <td style="font-weight:bold">Status</td>
                <td id="from" style="font-weight:bold;visibility:hidden">From Printer Serial#</td>
                <td id="to" style="font-weight:bold;visibility:hidden;">To Printer Serial#</td>
                <td style="font-weight:bold">Submit</td>
            </tr>
            <tr>
                <td><input type="text" name="printer_man_part_number" /></td>
                <td><input type="text" name="part_number" /></td>
                <td><input type="text" name="title" /></td>
                <td><input type="text" name="this_part_serial_number" /></td>
                <td>
                <select name="status" onchange="showstuff(this.value);">
                    <option></option>
                    <option value="in_use">In Use</option>
                    <option value="relocated">Relocated</option>
                    <option value="disposed">Disposed</option>
                    <option value="selling">Selling</option>
                </select>
                </td>
                <td id="from_field"><input type="text" name="from" style="visibility:hidden" /></td>
                <td id="to_field"><input type="text" name="to" style="visibility:hidden" /></td>
                <td><input type="submit" name="submit" value="Add Part" /></td>
            </tr>
        </table>
        </form>
4

1 に答える 1

2 
    function showstuff(element) {
        // first hide everything
        document.getElementById("from").style.visibility = 'hidden';
        document.getElementById("to").style.visibility = 'hidden';
        document.getElementById("from_field").style.visibility = 'hidden';
        document.getElementById("to_field").style.visibility = 'hidden';
        var targets;
        // select the IDs that should be unhidden based on element
        switch (element) {
          case 'in_use': targets = ['from', 'from_field']; break;
          case 'relocated': targets = ['to', 'to_field']; break;
          ...
        }
        // now unhide the selected IDs.
        for (var i = 0; i < targets.length; i++) {
          document.getElementById(targets[i]).style.visibility = 'visible';
        }
    }
于 2013-01-13T04:04:40.307 に答える