Question

我遇到了JS的问题。我的意思是当用户点击图像时，模态打开，我必须使用href。我不知道如何让它发挥作用。我只有模态。我告诉你我的代码：

＆＃13;

"(//input[@placeholder='Password'])[1]"

＆＃13;

var modal = document.getElementById('myModal');

var btn = document.getElementById("myBtn");

var span = document.getElementsByClassName("close")[0];

btn.onclick = function() {
  modal.style.display = "block";
}

span.onclick = function() {
  modal.style.display = "none";
}

window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}

＆＃13;

.modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  padding-top: 100px;
  /* Location of the box */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.4);
  /* Black w/ opacity */
}


/* Modal Content */

.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}


/* The Close Button */

.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

＆＃13;

感谢您的帮助！

Answer 1

我很难理解你想要完成的事情，但我想你会找到这样的事情：

<a href="javascript:;" class="image fit"><img src="images/film/min_1.png" id="myBtn" alt="" /></a>

Answer 2

我不知道这是否是您正在寻找的，但我通过将href设置为'＃'（参见jsFiddle demo）

来实现它

<a href="#" class="image fit"><img src="images/film/min_1.png" id="myBtn" alt="" /></a>

Answer 3

btn.onclick = function() {
  modal.style.display = "none";
}

在图片上单击，您将显示模态，将其更改为无，并且您可以在href中导航到您的给定网址

Answer 4

我知道这个问题是在多年前发布的，但是一段时间以来，我一直在努力寻找正确的答案。实际上，您可以这样做：

<a href="#" data-toggle="modal" data-target="your-modal-id" class="image fit">
  <img src="" id="" alt="" />
</a>

希望有人会有所帮助）

图像作为模态的href

4 个答案: