0

JavaScript カレンダーを 1 つのフォームで 3 回使用しています。最初のインスタンスは正常に動作します。2 番目と 3 番目のものは両方とも、onclick を表示する非表示の div にあります。これら 2 つのページの左上隅にカレンダーが表示されます。本来の位置に配置するにはどうすればよいですか？

    <div id="form_container">
    <form  method="post" action="index.php">
        <fieldset>
            <legend>Day One</legend>
            <li id="li_7" >
            <label class="description" for="d1_date">Date</label>
                <input type="text" name="d1_date" id="d1_date" value="<?php if(isset($_GET['d1_date'])){ echo $_GET['d1_date']; }else{ echo "";}?>" class="event_search_date_input" /> 
            </li>   
            <a class="add_day_link" onclick="document.getElementById('day_two_div').style.display='';position='relative';return false;" 
            href="" style="text-decoration:none;border-bottom:1px dotted blue;">Plan the next day...</a>
        </fieldset>
    </div>
    <div id="day_two_div" style="display:none;"> 
        <fieldset>
            <legend>Day Two</legend>
            <li id="li_14" >
            <label class="description" for="d2_date">Date</label>
                <input type="text" name="d2_date" id="d2_date" value="<?php if(isset($_GET['d2_date'])){ echo $_GET['d2_date']; }else{ echo "";}?>" class="event_search_date_input" /> 
            </li>   
            <a class="add_day_link" onclick="document.getElementById('day_three_div').style.display='';return false;" 
            href="" style="text-decoration:none;border-bottom:1px dotted blue;">Plan the next day...</a>
        </fieldset>
    </div><!-- close day_two_div -->    
            <li class="buttons">
                <input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" />
            </li>
        </ul>
    </form> 
    </div><!-- close formContainer -->

    <script type="text/javascript" src="../js/datepickr.js"></script>
    <script type="text/javascript">
        new datepickr('d1_date', {
            'dateFormat': 'Y-m-d'
        });
        new datepickr('d2_date', {
            'dateFormat': 'Y-m-d'
        });
        new datepickr('d3_date', {
            'dateFormat': 'Y-m-d'
        });
    </script>

これは私が修正する必要があると感じるコードですか?

    var calendarContainer = buildNode('div', { className: 'calendar' });
    calendarContainer.style.cssText = 'display: none; position: absolute; top: ' + (inputTop + this.element.offsetHeight) + 'px; left: ' + inputLeft + 'px; z-index: 100;';
4

1 に答える 1

0 
var dd = document.createElement("div");  
dd.addClass("calendar");  
dd.style.cssText = 'display: none; position: absolute; top: 0; left: 0; z-index: 100;';  
var b = document.getElementsByTagName("body")[0];  
b.appendChild(dd);

これはあなたが説明したことの単なる転写です。
アイデアはとにかく適用されます。より具体的なコードが必要な場合は、状況をより詳細に説明し、完全なコードを投稿してください。どの変数が使用されているかなどは、他の方法では確認できません。

于 2013-01-05T11:37:29.747 に答える