0

Drupalによって生成された次のHTMLがあります

<fieldset id="webform-component-lunchset" class="webform-component-fieldset form-wrapper" style="">
    <div id="webform-component-lunchset--lunch" class="form-item webform-component webform-component-radios webform-container-inline" style="">
        ...Radio Button div tags here
    </div>
</fieldset>
<fieldset id="webform-component-dinnerset" class="webform-component-fieldset form-wrapper" style="display: none;">
    <div id="webform-component-dinnerset--dinner" class="form-item webform-component webform-component-radios webform-container-inline" style="display: none;">
        ...Radio Button div tags here
    </div>
</fieldset>

私の意図は、ユーザーが予約を開始する時刻に基づいて食事の時間を選択できるようにすることです。これを行うには、style="display: none;" を変更する必要があることに気付きました。非表示にしたいフィールドセットと、表示したいフィールドセットの style="" 。DIV タグのスタイル属性を変更する次の Javascript ステートメントがありますが、機能していないようです。どんな助けでも大歓迎です。

window.onload = (function() { 
    var today = new Date();
    var day = today.getDay();
    var hour = today.getHours();
    var lunchtime1 = document.getElementById('webform-component-lunchset');
    var lunchtime2 = document.getElementById('webform-component-lunchset--lunch');
    var dinnertime1 = document.getElementById('webform-component-dinnerset');
    var dinnertime2 = document.getElementById('webform-component-dinnerset--dinner');
    if (hour >= 15 && hour < 22) {
        lunchtime1.style="display: none;";
        lunchtime2.style="display: none;";
        dinnertime1.style=" ";
        dinnertime2.style=" ";
        sundaytime1.style="display: none;";
    }
});

なぜ機能しないのかわからないので、助けていただければ幸いです。前もって感謝します

4

3 に答える 3

1

ノードへの参照のプロパティを使用する場合styleは、DOMAPIを使用しています。DOMElementオブジェクトには、と呼ばれるプロパティがありstyle、これもオブジェクトである必要があります。したがって、次のように記述します。

lunchtime1.style.display = 'none';

または、setAttributeメソッドを使用します。これにより、スタイル属性全体を一度に設定できます。

lunchtime1.setAttribute('style','display: block; background-color: #F00;');

それでうまくいくはずです...

注：
Tim Downが指摘したように、古いIEはsetAttributeまともなブラウザーほどうまく機能しないため、最初のアプローチが最も信頼性が高くなります。私はその問題を調査しています。someNode.setAttribute('onclick', 'clickHandler()');IEでは、たとえば書き込みはできません。
特定の要素（多くの場合、フォーム要素）にのみ影響するように見える問題も発生しましたが、スタイル属性の設定に関しては、確信が持てません...特定の属性を設定できないか、一部の要素に属性を設定できません。何でも...これについてもっと知ったら、この答えを更新します。（現在、周りにウィンドウボックスがないため、テストするIEはありません）

于 2013-01-25T12:20:50.467 に答える
0 
dinnertime1.style.display="inline";
于 2013-01-25T12:19:23.483 に答える
0

ありえないと思いますstyle="<string>"。あなたは書く必要がありますlunchtime1.style.display = "none"。スタイルは「完全な」js オブジェクトです。

とにかく、jQuery を使用しない理由はありますか?

于 2013-01-25T12:19:36.760 に答える