Question

我正在尝试创建一个更改定义对象的attr的按钮栏但无法使其工作。请参阅以下代码段（CSS未包含）：

按钮条形码

<ul id="filtering-nav">
<li class="work button active" value="../servlet/Web">Work</li>
<li class="like button"  value="../servlet/Home">home</li></ul>

脚本代码

<script> var buttons = $("#filtering-nav .button"); buttons.click(function(){
buttons.removeClass("active");
$(this).addClass("active");
$( "#alpha100" ).attr("data", $("#filtering-nav .button.selected").val() );});</script>

目标对象代码

<object id='alpha100' type="text/html" data=""  width="100%" height="100%"></object>

有谁知道我在做错了什么？

我可以通过下拉框获得类似的功能。

Answer 1

您似乎想要.button.active而不是.button.selected。

但是你可以让你的代码更简单：

var buttons = $("#filtering-nav .button");
buttons.click(function(){
   buttons.removeClass("active");
   $(this).addClass("active");
   $("#alpha100" ).attr("data", $(this).attr('value'));
});

请注意，今天的自定义属性应命名为data-something。 data和value不是好的属性名称。使用标准自定义数据属性，您将使用特定的data函数：

   $("#alpha100" ).data("something", $(this).data('otherthing'));

Answer 2

当您尝试将value用于li标记时，我不知道幕后发生了什么。这可能是问题的一部分，所以我建议你采用这种方法（使用data属性）

<强> HTML

<ul id="filtering-nav">
   <li class="work button active" data-value="../servlet/Web">Work</li>
   <li class="like button"  data-value="../servlet/Home">home</li>
</ul>

<强> JS

<script> 
    var buttons = $("#filtering-nav .button"); buttons.click(function(){
    buttons.removeClass("active");
    $(this).addClass("active");
    $( "#alpha100" ).attr("data", $("#filtering-nav .button.selected").data('value') );});
</script>

其他东西（正如破坏指出的那样）：你的意思是.button.active而不是.button.selected？

按钮栏以更改对象的url源

2 个答案: