2016-09-08 1 views
4

Ich habe eine Seite namens Page1, die eine Schaltfläche haben.Wie Umleitung zu einer anderen Seite und bestimmte div auf Schaltfläche klicken in mvc

<button onclick="redirecttodivofotherpage(); "></button> 

Die andere Seite 2 haben 3 Div

<div id="div1"></div> 
<div id="div2"></div> 
<div id="div3"></div> 

ich auf den Knopf klicken Seite1-Taste, um div3 umleiten möchten.
Wie es mit Controller oder Jquery zu tun.

+0

Sie meinen Sie zu Ihrem dritten div blättern wollen, wenn die Schaltfläche klicken in derselben oder in einer anderen Seite –

+1

ja i automatisch div3 auf die Schaltfläche klicken –

+0

Ich habe zwei Möglichkeiten blättern wollen, es zu tun, versuchen Sie eine der es, ich denke, der zweite ist nett. viel Glück –

Antwort

4

Man könnte so etwas wie dies versucht:

<button class="js-btn"></button> 

$(function(){ 
    $(".js-btn").on("click",function(){ 
     window.location = "..../#div3"; 
    }); 
}) 

Die Zeichenfolge "..../#div3" die relative URL Ihrer Seite darstellen und am Ende ein #div3 hat. Auf diese Weise werden Sie unter Verwendung von window.location zu der gewünschten Seite umgeleitet und verwenden für den gewünschten Abschnitt.

+0

groß ..., das hat richtig funktioniert für mich Danke .. –

+0

@SaurabhSolanki Sie sind willkommen. Ich bin froh, dass ich geholfen habe. – Christos

2

versuchen, diese Arbeit Demo, die

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title></title> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
\t <button class="click">Click Me</button> 
 
\t <div id="mydiv" style="border:2px solid black;width:800px;height:900px; background-color:orange; position:absolute;top:1000px;margin:20px;"> 
 
\t \t hello anuradh 
 
\t </div> 
 
</div> 
 

 
<script type="text/javascript"> 
 
\t $(document).ready(function(){ 
 
\t \t $(".click").on('click',function(){ 
 
\t \t \t window.location = "#mydiv"; 
 
\t \t }); 
 
\t }); 
 
</script> 
 

 
</body> 
 
</html>

oder sonst können Sie es bewegen schön wie dieses

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title></title> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
\t <button class="click">Click Me</button> 
 
\t <div id="mydiv" style="border:2px solid black;width:800px;height:900px; background-color:orange; position:absolute;top:1000px;margin:20px;"> 
 
\t \t hello anuradh 
 
\t </div> 
 
</div> 
 

 
<script type="text/javascript"> 
 
\t $(document).ready(function(){ 
 
\t \t $(".click").on('click',function(){ 
 
\t \t \t //window.location = "#mydiv"; 
 

 
\t \t \t $('html, body').animate({ 
 
     \t \t  scrollTop: $("#mydiv").offset().top 
 
    \t \t \t \t }, 2000); 
 
\t \t \t }); 
 
\t }); 
 
</script> 
 

 
</body> 
 
</html>

+0

die zweite Methode funktioniert ohne uri wie "Home/Page1 /" ?? Onlu mit Div Name ?? –

+0

so machen Sie das Scrollen auf der gleichen Seite, dann macht es eine Sache –

+0

Nein, ich möchte auf bestimmte div einer anderen Seite –

2

Verwenden Sie einen arbeiten window.location.hash, um zu dem Element mit der ID zu scrollen

<button class="js-btn"></button> 

$(function(){ 
    $(".js-btn").on("click",function(){ 
     window.location.hash = "#div3"; 
    }); 
}); 
4

Dies kann mit Cookies erfolgen. Setzen Sie ein Cookie mit der ID, die Sie scrollen möchten, und lesen Sie dann, wenn die neue Seite geladen ist, den Cookie und scrollen Sie zur definierten ID. Ich habe das sehr populäre Plugin jquery-cookie verwendet.

Überprüfen Sie diese Beispiellösung Hinweis: Klicken Sie auf Ereignisse, um zur anderen Seite zu gelangen.

**http://plnkr.co/edit/hBJj69nP6kvrEuoCVw3k?p=preview** 
Verwandte Themen