利用jquery为面包屑添加单击添加按钮

在jQuery中，你可以轻松地为面包屑导航添加单击添加按钮的功能。首先，你需要准备HTML结构，包含一个面包屑列表和一个可点击的“+”按钮。例如：

<nav class="breadcrumb">
  <a href="#" class="crumb current">首页</a>
  <span class="separator">»</span>
  <!-- 更多链接将动态生成 -->
</nav>
<button id="addCrumb" class="btn-add">+</button>

接下来，使用JavaScript/jQuery来处理单击事件：

$(document).ready(function() {
  // 获取面包屑容器和添加按钮
  var breadcrumbContainer = $('.breadcrumb');
  var addButton = $('#addCrumb');

  // 添加点击事件监听器
  addButton.on('click', function(e) {
    e.preventDefault(); // 阻止默认行为（防止页面跳转）

    // 动态创建一个新的面包屑链接，并添加到链表中
    var newCrumb = $('<a href="#">新链接</a>');
    breadcrumbContainer.append(newCrumb); // 插入到面包屑列表末尾

    // 如果需要更新链接内容，可以在这里替换新Crumb元素的内容
    // newCrumb.text('新的链接文本');

    // 可能还需要一些其他逻辑，比如阻止新添加的链接再次触发点击事件等
  });
});

在这个例子中，当用户点击“+”按钮时，会动态添加一个新的链接到面包屑列表中。记得根据实际需求调整HTML结构和功能。