javascript-窗口调整大小脚本有意外的副作用

2019-12-08 03:33:39 阅读：204 来源： 互联网

当元素添加到页面时,我写了一个简短的javascript来调整弹出窗口的大小.
出于某种原因,每次添加新元素时,窗口的宽度都会减少4个像素,尽管它应该保持不变,因为添加元素的宽度始终相同.

知道是什么原因造成的吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <script type="text/javascript" src="scripts.js"></script>
    <script type="text/javascript">
        function resizeWin(){
            var winHeight=document.getElementById('bodyArea').offsetHeight;
            var winWidth=document.getElementById('bodyArea').offsetWidth;
            alert(winWidth);
            window.resizeTo(winWidth+20,winHeight+80);
        }

    </script>
</head>
<body onl oad="javascript:resizeWin()"> 
<div id="bodyArea" style="overflow: hidden;"> 
    <form id="courseDetails" action="/CourseRegistration/Courses" method="POST" width: 300px">
        <table>
                //blah blah, constant size
        </table>

        <input type="button" value="Add Session" onclick="addRow('addCourse');resizeWin();" />
        <input type="button" value="RemoveSession" onclick="deleteRow('addCourse');resizeWin();" />

        <table id="addCourse" border="1">
            <tr>
                <td><input type="checkbox" name="chk"/></td>
                <td>
                    <select name="day">
                        <option value="1">Sunday</option>
                        <option value="2">Monday</option>
                        <option value="3">Tuesday</option>
                        <option value="4">Wednesday</option>
                        <option value="5">Thursday</option>
                        <option value="6">Friday</option>
                        <option value="7">Saturday</option>
                    </select>
                </td>
                <td>
                    <select name="start">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                       <option value="5">5</option>
                <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                    </select>
                </td>
                <td>
                    <select name="duration">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                </select>
            </td>
        </tr>
    </table>
    <input type="submit" value="Submit" name="addCourse" />
    </form>
    </div>
</body>
</html>

解决方法:

在

< form id =“ courseDetails” action =“ / CourseRegistration / Courses” method =“ POST” width：300px“>

您缺少了width的opening =“；请尝试width =” 300px“可能就是一些错误.

标签：resize,window-resize,javascript
来源： https://codeday.me/bug/20191208/2088573.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-窗口调整大小脚本有意外的副作用