簡體   English   中英

捕獲href並防止事件默認

[英]Capturing href and prevent event default

不確定為什么代碼不起作用。 javascript不打印警告框也不會阻止事件默認。 我假設數據將異步加載,使我保持在同一頁面上。

<!DOCTYPE html> 
<html> 
<head> 
<title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
    <link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
<div data-role="page"> 
<div data-role="header"></div> 
    <div data-role="content">
        <p id = "heading">Is Nursing For You?</p>
        <br/>
        <div id = "div1" align="center"></div>
    </div> 
<div data-role="footer" id = "foot" data-position="fixed">
<table>
    <tr>
        <th><h1 id = "alignLeft">Future Goals</th></h1>
        <th><h1 id = "socialMediaText alignCenter">Get Social With Us!</h1>
</th>
        <th></th>
    </tr>
    <tr>
        <td id = "alignLeft">Telephone: 304-444-39876</td>
    <tr>
        <td = "alignLeft">Email: futurenurseky@gmail.com</td>
    </tr>
    </tr>
</table>
</div> 
</div> 

This is where im having the trouble at. Not sure why the alert is not sending or redirecting me.
<script type='text/javascript'>
$(document).ready(function(){
$("#div1").load("FONWVhp.php");
    $('#div1').click(function(e){
    e.preventDefault();
    alert($(this).attr('href'));
});
});




    </script>

</body>
</html>

這是在加載頁面時調用的Fp.php,但是一旦頁面加載,就會顯示href。 因此,當人們點擊href時,頁面將保留,但數據將發生變化,並從articles.php獲取信息(在底部)。

$sqlPAQuery = "SELECT pages.pageId, pages.pageTitle FROM pages order by 
pages.pageId";
$paqueryResult = mysqli_query($conn,$sqlPAQuery);
while ($paqueryRow = mysqli_fetch_object($paqueryResult))
{


$pages = "<div class='center-wrapper'><a href = articles.php?
pageId=".$paqueryRow->pageId."><button class= center-wrapper'>".$paqueryRow-
>pageTitle."</button></a><br/><br/></div>";
echo $pages;

}

articles.php

$sqlARTICLEQuery = "SELECT * FROM articles where pageId=".$_GET['pageId']." 
order by articleId";
$articlequeryResult = mysqli_query($conn,$sqlARTICLEQuery);
while ($articlequeryRow = mysqli_fetch_object($articlequeryResult))
{
$articles ="<div id = 'div1' class='center-wrapper'><a href = 
article.php?articleId=".$articlequeryRow->articleId."><button id 
='wrapper'>".$articlequeryRow->articleTitle."</button></a><br/><br/></div>";

echo $articles;
}

您需要在操作之前等待div內容加載 試試這個:

$(document).ready(function() {
    $("#div1").load('FONWVhp.php', function() {
        $('#div1 div.center-wrapper a button').click(function(event){
            event.preventDefault();
            alert($(this).parent().attr('href'));
        });
    });
});

另外,我已經糾正了代碼中的一些錯誤:

  1. 而不是$('#div1').click(...)使用$('#div1 div.center-wrapper a button').click(...)
  2. 我想你想要錨點的href,所以你需要使用alert($(this).parent().attr('href'))

只需在函數中放入一個e / event即可

<script type='text/javascript'>

 $(document).ready(function(){
     $("#div1").load("Fp.php"); 
     $('div.div1 a button').click(function(e){ 
         e.preventDefault(); 
         alert($(this).attr('href')); 
     });
 });
</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM