0

我有一个带有滚动条（默认滚动条）的 html 页面，并且在页面底部有一个小表单。

现在的问题是，当我向下滚动并单击“选择/列表”菜单以从表单中选择任何选项时，滚动条会向上移动。为什么会这样？我仍然可以选择选项，因为页面不是很长。为什么滚动条向上？有人可以帮我吗？

我读到有时 # 链接可能是原因，我尝试将其删除，但仍然相同。在我的页面中还有“onfocus = ...”，我尝试将其删除并对其进行了测试，但它仍然会上升。

提前致谢。

这是表单的代码。

<div class="bottom-form">
<form action="#" method="post">

<div class="main-inp-box">
<div class="inp-box">
  <label>
  <input type="text" name="textfield" id="textfield" class="field1" placeholder="Enter your first name" onblur="if(this.value=='') this.value='Enter your first name';" onfocus="if(this.value=='*Enter your first name:') this.value='';"/>
  </label>
</div>


<div class="inp-box">  
<label>
  <input type="text" name="textfield" id="textfield" class="field1" placeholder="Your email id here" onblur="if(this.value=='') this.value='Your email id here ';" onfocus="if(this.value=='*Your email id here:') this.value='';"/>
  </label>
</div>


<div class="inp-box" style="margin-right:0">
<dl id="sample" class="dropdown">
        <dt><a href="#"><span style="color:#dad9d9; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; font-style:italic; ">Select your role</span></a></dt>
        <dd>

            <ul>
            <div class="head2"><strong>Lorem ipsum</strong></div>
                <li><a href="#">Option1<span class="value">xx</span></a></li>
                <li><a href="#">Option2<span class="value">yy</span></a></li>
    <li><a href="#">Option3<span class="value">yy</span></a></li>
            </ul>

        </dd>
       </dl>
</div>

</div>

<div class="main">
<div class="notify_btn_box"><a href="#" class="red-btn"></a></div>
<div class="arrow"><img src="images/arrow.png" /></div>
</div>

<div style="text-align:center; margin-bottom:100px;"><span class="text-note">*we have no spam policy</span></div>

</form>
</div>

这是更新的代码。删除了#

<div class="inp-box" style="margin-right:0">
<dl id="sample" class="dropdown">
        <dt><a href=""><span style="font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:normal; font-style:normal; color:#909090; ">Select your role</span></a></dt>
        <dd>

            <ul>
            <div class="head2"><strong>Who are you?</strong></div>

                <li><a href="">Option1<span class="value">xx</span></a></li>
                <li><a href="">Option2<span class="value">yy</span></a></li>
                <li><a href="">Option3<span class="value">yy</span></a></li>
            </ul>
        </dd>
    </dl>
</div>
4

1 回答 1

1

您正在使用<dl>标签，就好像它是一个下拉列表，但它实际上是一个定义列表。下拉菜单是使用<select>标签创建的，一旦你修复了它，你将不再需要这些<a href="#">项目（它们会导致滚动）。

于 2012-07-23T21:37:50.843 回答