Question

在我的codepen中，我有两个下拉列表，每个下拉列表都有自己的链接，目前有一个相对网址。

列表项的基本结构如下所示：

<ul class="which-way">
    <li class="which-init">Unguided I-Day Return Trips</li>
    <li data-value="value 2" class="cadja"><span class="value">beginners</span><span class="real">Darling Wine & Beer Trip</span></li>
    <li data-value="value 3" class="cadja"><span class="value">mamre-werf-khwa-ttu-culture-day-by-which-way-trips</span><span class="real">Culture & Adventure Trip</span></li>
    <li data-value="value 4" class="cadja"><span class="value">cape-west-coast-wildlife-fossil-trip</span><span class="real">Wildlife & Fossils Trip</span></li>
</ul>

使用jquery，我设法使用类值获取跨度内的文本。

现在我想在点击它时将该值添加到网址，并且网址应如下所示：

例如：http://www.google.com/beginners

单击li后单击链接时，href不会更改。

如何将href更改为我想要的链接？

我的JS目前看起来像这样：

$(document).ready(function(){
  $("ul.which-way").on("click", function() {
    $(this).find('li').toggleClass("open-list");
    $(this).find('open-list').css("display", "block");
  });
  $("li.cadja").on("click", function(){ 
    $($(this).parent().find('.which-init')[0]).html($(this).html());
    handleDropdownOne();
  });  
});
window.handleDropdownOne = function() {
  var dropOneValue = $($($('.drowpdown-one').find('.which-init')[0]).find('span.value')[0]).text();
  console.log(dropOneValue);
};
handleDropdownOne();
$('a#trip').on("click", function(){
  $(this).attr("href", "https://www.westcoastway.co.za/"+dropOneValue);
});

请帮忙

Answer 1

声明你的变量＆＃34; dropOneValue＆＃34;外部功能

$(document).ready(function() {
$("ul.which-way").on("click", function() {
    $(this).find('li').toggleClass("open-list");
    $(this).find('open-list').css("display", "block");
});
$("li.cadja").on("click", function() {
    $($(this).parent().find('.which-init')[0]).html($(this).html());
    handleDropdownOne();
});
});
var dropOneValue = '';
window.handleDropdownOne = function() {
dropOneValue = $($($('.drowpdown-one').find('.which-init')[0]).find('span.value')[0]).text();
console.log(dropOneValue);
};
handleDropdownOne();
$('a#trip').on("click", function() {
    $(this).attr("href", "https://www.westcoastway.co.za/" + dropOneValue);
});

未使用jquery中的click函数设置属性引用

1 个答案: