如何在mvc中单击按钮时重定向到另一个页面和特定的div
Posted
技术标签:
【中文标题】如何在mvc中单击按钮时重定向到另一个页面和特定的div【英文标题】：How to redirect to another page and specific div on button click in mvc 【发布时间】：2017-01-15 22:19:39 【问题描述】：我有一个名为 Page1 的页面，其中有一个按钮。
<button onclick="redirecttodivofotherpage(); "></button>
另一个Page2有3个Div
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
我想在点击 Page1 按钮时重定向到 div3。 如何使用控制器或 jquery 来完成。
【问题讨论】：
您的意思是当按钮在同一页面或另一个页面中单击时，您想滚动到第三个 div 是的，我想在点击按钮时自动滚动到 div3 我添加了两种方法，尝试其中一种，我认为第二种很好。祝你好运 【参考方案1】：你可以试试这样的：
<button class="js-btn"></button>
$(function()
$(".js-btn").on("click",function()
window.location = "..../#div3";
);
)
字符串"..../#div3" 代表您页面的相对URL，最后有一个#div3。这样，使用window.location，您将被重定向到您想要的页面，并使用#div3 到您想要的部分。
【讨论】：
@SaurabhSolanki 欢迎您。我很高兴能帮上忙。【参考方案2】：这可以通过 cookie 来完成。使用要滚动的 id 设置 cookie，然后在加载新页面时读取 cookie 并滚动到定义的 id。我使用了非常流行的插件jquery-cookie。
查看此示例解决方案 注意：单击事件导航到其他页面。
**http://plnkr.co/edit/hBJj69nP6kvrEuoCVw3k?p=preview**
【讨论】：
【参考方案3】：试试这个工作演示，它会工作
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<button class="click">Click Me</button>
<div id="mydiv" style="border:2px solid black;width:800px;height:900px; background-color:orange; position:absolute;top:1000px;margin:20px;">
hello anuradh
</div>
</div>
<script type="text/javascript">
$(document).ready(function()
$(".click").on('click',function()
window.location = "#mydiv";
);
);
</script>
</body>
</html>否则你可以像这样很好地滚动它
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<button class="click">Click Me</button>
<div id="mydiv" style="border:2px solid black;width:800px;height:900px; background-color:orange; position:absolute;top:1000px;margin:20px;">
hello anuradh
</div>
</div>
<script type="text/javascript">
$(document).ready(function()
$(".click").on('click',function()
//window.location = "#mydiv";
$('html, body').animate(
scrollTop: $("#mydiv").offset().top
, 2000);
);
);
</script>
</body>
</html>【讨论】：
第二种方法可以在没有 uri 的情况下工作，例如“Home/Page1/” ?? onlu 与 Div 名称？？ 所以你在同一个页面上滚动，然后就可以了 不，我想重定向到另一个页面的特定 div 然后使用第一种方法并给出link
是的，但第一种方法不提供平滑滚动。直接显示div似乎很奇怪。【参考方案4】：
使用 window.location.hash 滚动到具有 id 的元素
<button class="js-btn"></button>
$(function()
$(".js-btn").on("click",function()
window.location.hash = "#div3";
);
);
【讨论】：
【参考方案5】：试试这个，它对我有用：
<a class="className">link</a>
$(".className").on("click", function ()
window.location = "yourPage.html#divId";
);
【讨论】：
以上是关于如何在mvc中单击按钮时重定向到另一个页面和特定的div的主要内容，如果未能解决你的问题，请参考以下文章
使用反应路由器在sharepoint框架webpart中路由？我陷入了一种情况，我必须在单击按钮时重定向到另一个页面。
当用户在 asp.net mvc3 中未授权时重定向到另一个页面
当用户在 asp.net mvc3 中未授权时重定向到另一个页面