Question

我有2个框data-attributes用于2个不同的页面。当您点击A时，href应从index.html更改为index.html/a，如果您点击B，则应移除/a并添加{{ 1}}。

我已经能够更改变量，但是当您单击另一个框时则不能。所以我得到/b。我想应该在两个方框之间切换。

HTML

index.html/a/b

JS

<div class="box" data-id="a"></div>

<div class="box" data-id="b"></div>

<a class="link" href="index.html>Click Me</a>

Answer 1

以下内容将从链接中获取当前的href并移除/a或/b并附加您点击的框的ID。

（我在框中添加了样式以使其在代码段中可见）

var link = $('a');

$('.box').on('click', function () {
  var id = $(this).attr('data-id');
  var newHref = link.attr('href').replace(/\/(a|b)/, '') + '/' + id;
  link.attr('href', newHref);
  $('#result').text(newHref);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box" data-id="a" style="width:100px;height:100px;background:red"></div>

<div class="box" data-id="b" style="width:100px;height:100px;background:blue"></div>

<a class="link" href="index.html">Click Me</a>
                      
<div id="result"></div>

在href元素上添加和删除变量？

1 个答案: