2014-12-01 4 views
0

благодарит за чтение этого Я делаю сайт. У меня есть всплывающее окно, которое спрашивает, если вам исполнилось 18 лет. Когда вы нажмете «да», появится форум, который я делаю. Когда вы нажимаете кнопку ответа, по какой-то неизвестной причине всплывающее окно снова появляется. Почему?Почему мой jquery-код сбой для анимации?

это файл php.

<!DOCTYPE html 
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html> 
<head> 
<title>Umich Chan</title> 
<link rel="stylesheet" type="text/css" href="index.css"> 
<script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script type="text/javascript" src="index.js"> 
</script> 


</head> 
<body> 

<div id="confirmage"> 
    <h2 style="text-align:center;">Are you older than 18 years old?</h2> 
     <button id="close" style="display:block;margin-left:auto;margin-right:auto;margin-bottom:5px;">Yes</button> 
     <button id="linknoclose" style="display:block;margin:auto;">No</button> 
</div> 

<div id="fadeina" style="opacity:0;"> 
<p> 
</p> 

<a href="addpost.html">Post Anonymously Now</a><br> 

<br> 


<?php 

// Connect to server and select database. 
$con = mysqli_connect("$host", "$username", "$password", "$db_name") or die ("cannot connect"); 

$result = mysqli_query($con, "SELECT * FROM Table_forum ORDER BY `key` DESC");// 

// Start looping table row 

while($rows = mysqli_fetch_array($result)){ 
$key=$rows['key']; 
$name=$rows['name']; 
$input=$rows['input']; 

echo "<div class='answerbox'>"; 
echo '<font color="blue">' .$name. '</font>'; 
echo "<br />"; 
echo "$input."; 
echo "<a class='reply' href=''>Reply</a>"; 
echo "</div>"; 
echo "<div class='replybox'><textarea></textarea></div>"; 

/* 
echo "<div class='commentbox'>"; 
$namecomment = mysqli_query($con, "SELECT namea FROM `postcomments` WHERE keya = '1'");// 
echo ".$name."; 
$inputcomment = mysqli_query($con, "SELECT input FROM `postcomments` WHERE keya = '" .mysql_real_escape_string .$key."'");// 
echo ".$inputcomment."; 
echo "</div>"; 
*/ 
} 
mysql_close(); 
?> 

</div> 
</body> 
</html> 

Этот файл js.

$(document).ready(function() { 
    $(".replybox").hide(); 
    $(".reply").css("color","blue"); 

    $("#fadeina").hide(); 

    $(".reply").click(function(){ 
     $(".replybox").show(); 
    }); 

    $("#close").click(function(){ 
     $("#confirmage").remove(); 
    }); 

    $("#close").click(function(){ 
     $("#confirmage").empty(); 
    }); 

    $("#close").click(function(){ 
     $("#fadeina").fadeTo('slow',1); 
    }); 

    $("#linknoclose").click(function(){ 
     history.back(); 
     return false; 
    }); 
}); 
+0

Можете ли вы сделать SO Snippet для этого? – Justinas

+0

Что это значит? –

+0

Это седьмой значок слева в вопросе/поле для ответа (коробка с карандашом) или просто CTRL + M – Justinas

ответ

0

всплывающее окно появляется снова, потому что ваш Reply ссылка имеет пустой href:

"<a class='reply' href=''>Reply</a>";

Как указано в RFC 2396: ссылка URI, который не содержит URI является ссылка к текущему документу. Другими словами, пустой URI, ссылка в документе интерпретируется как ссылка на начало этого документа

попытаться использовать href="javascript:;".

+0

Спасибо Jonny. Ценить это –

0

В отличие от элементов <button>, якорь «ответ» требует e.preventDefault() (или return false), чтобы подавить его естественную гиперссылку, что приведет к перезагрузке страницы.

Код также будет значительно упрощен.

$(document).ready(function() { 
    $(".replybox, #fadeina").hide(); 

    $(".reply").css("color","blue").on('click', function(e) { 
     e.preventDefault(); //<<<<<<<< 
     $(".replybox").show(); 
    }); 

    $("#close").on('click', function() { 
     $("#confirmage").remove(); 
     $("#fadeina").fadeTo('slow', 1); 
    }); 

    $("#linknoclose").on('click', function() { 
     history.back(); 
    }); 
}); 
Смежные вопросы