Question

你好，这就是我想做的。我想在用户点击链接后显示警告框。我的链接指向另一个php页面，但它会再次返回到找到链接的页面。我怎样才能实现这一目标？有人可以给我一些关于如何做的想法吗？

这是我尝试但不工作的。

<?php

function fsa() {
  echo '<div class="alert alert-success alert-dismissable" id="success-alert">';
  echo '<strong>Successfully posted!</strong>';
  echo '</div>';
}


<a class='btn btn-info left-margin' href="dbf-import.php" onclick="fsa()">Import Database</a>

Answer 1

PHP用于生成HTML和JS。你可以在PHP文件中同时拥有它们，但是你需要看到PHP和JS之间的区别。你调用fsa（）的函数是一个JS函数，因为它将运行客户端（在客户端机器上并在页面加载后）。 HTML标记中的onclick参数需要挂钩JS函数。这样，当您点击<a>标记时，fsa（）将被触发，该框将显示在页面上。

// this is JS, you need <script> tags !!!
<script>
function fsa() {
  // define a new variable
  var box = '';
  // add the HTML inside the JS variable
  box += '<div class="alert alert-success alert-dismissable" id="success-alert">';
  box += '<strong>Successfully posted!</strong>';
  box += '</div>';

  // append the HTML contained inside box to the body
  document.querySelector('body').innerHTML += box;
}
</script>

<a class='btn btn-info left-margin' onclick="fsa()">Import Database</a>

如果您希望在不重新加载客户端页面的情况下保存数据，则可能需要使用AJAX

Answer 2

这是一个显示单击按钮时可接收警告框的示例。

$(document).ready(function() {
  $('.activater').click(function() {
    $('.alert').show()
  })
});

.alert {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" />

<body>
  <div class="container">
    <h2>Dismissal Alert Messages</h2>
    <button class="activater">Send Message</button>
    <a class="activater">SHOW MESSAGE</a>
    <div class="alert alert-success alert-dismissable">
      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
      Success! message sent successfully.
    </div>

  </div>
</body>

Answer 3

您可以通过Bootstrap模式而不是警告框来实现它。您可以根据需要进行设计。

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
click on this link : 
  <!-- Trigger the modal with a button -->
  <span data-toggle="modal" data-target="#myModal">www.google.com</span>

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Alert Box. Click 'OK' to go to www.google.com</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" onClick="document.location.href='www.google.com'">Go</button>
        </div>
      </div>
      
    </div>
  </div>
  
</div>

</body>
</html>

＆＃13;

Answer 4

试试这个

<script type="text/javascript">
function Alert() {
var answer = confirm ("Successfully posted!Please click on OK to continue.")
if (answer)
window.location="http://www.yoursite.com";
}
</script>

<a href="javascript:Alert();">click me</a>

Answer 5

首先，像@Iceman说的那样：你正试图在php中运行一个javascript函数，所以首先删除所有这些。如果您只是希望用户在点击链接时获得提示框，则只需添加

即可

<script> function fsa(){
    alert("Your alert message");
}
</script>

另外，如果你不希望这个人离开一边，只需把href='#'放在那里就可以了。

如何在单击链接后显示警告框

5 个答案: