javascript - 显示内容的问题

标签 javascript jquery html css

<分区>


想改进这个问题吗? 通过 editing this post 添加细节并澄清问题.

关闭 9 年前

在私信系统点击回复给其他用户,会出现一个框,

当我点击它的时候它就不会了

HTML

<form action="#" method="post">
<input type="submit" name="svar" value="Svar" id="indholdcklik" class="click svarpm">
</form>

要在页面上显示的内容

<div id="indholdbeksed">
hey
</div>

CSS

#indholdbeksed {
    display: none;
    margin: 10px 0px;
}
.click {
    font-weight: bold;
    color: #ffffff;
    background: #79bbff;
    background: -moz-linear-gradient(top, #79bbff 0%, #4197ee 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#79bbff), color-stop(100%,#4197ee));
    background: -webkit-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: -o-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: -ms-linear-gradient(top, #79bbff 0%,#4197ee 100%);
    background: linear-gradient(to bottom, #79bbff 0%,#4197ee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#79bbff', endColorstr='#4197ee',GradientType=0 );
}
.click:hover {
    background: #4197ee;
    background: -moz-linear-gradient(top,  #4197ee 0%, #79bbff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4197ee), color-stop(100%,#79bbff));
    background: -webkit-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: -o-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: -ms-linear-gradient(top,  #4197ee 0%,#79bbff 100%);
    background: linear-gradient(to bottom,  #4197ee 0%,#79bbff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4197ee', endColorstr='#79bbff',GradientType=0 );
}

页面顶部会显示这里:

jQuery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

$("#indholdcklik").click(function() {
  $("#indholdbeksed").slideDown("slow",function() {
    // Animation complete.
  });
});

最佳答案

我创建了 jsfiddle并添加 document.ready 以启动您的 javascript 然后文档准备就绪并添加 return false 以防止表单提交。 现在一切正常。

关于javascript - 显示内容的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20599363/

上一篇:jquery - 如何在 colorbox 中重新定位展开的图像

下一篇:php - 在切换旁边添加 "MENU"(文本)?

相关文章:

javascript - 获取父元素 html 以及子内容

Javascript For..In 循环执行 if 和 else 语句

JavaScript 包括

javascript - 呈现货币和符号并与来自不同单元格的数据结合

html - CSS:第二个 <div> 没有滚动条

php - 使用 this.form.submit() 上传图片时出现问题;

javascript - 是否可以从我的页面获取另一个选项卡 url?

javascript - 寻找匹配的脚本和示例

javascript - 将 Bootstrap 4 Carousel 与动画文本同步(morphext)

html - 使用 Flexbox 并且我想放置一个盒子