Question

我想在点击相应的图片后更改li标签的列表样式。这就是我到目前为止所做的。

$('#foodOrder').click(function() {
      $(this " > li").css('list-style', 'disc');
    });

#foodOrder {
  list-style: circle;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<span id="foodOrder"><img id="orderFood" src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png" alt="" /><li>CIABATTA</li></span>
      <span id="foodOrder"><img id="orderFood" src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png" alt="" /><li>BAKERS BUN</li></span>

Answer 1

修复了jQuery选择器（语法错误）和HTML：

<li>必须仅位于<ul>，<ol>或<menu>。
<span>必须仅包含Phrasing content，<ul>为Flow content。您应该使用<div>然后。

JSFiddle

$('.foodOrder').click(function() {
    $('li', this).css('list-style', 'disc');
});

.foodOrder li {
    list-style: circle;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="foodOrder">
    <img class="orderFood" src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png" alt=""/>
    <ul>
        <li>CIABATTA</li>
    </ul>
</div>
<div class="foodOrder">
    <img class="orderFood" src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png" alt=""/>
    <ul>
        <li>BAKERS BUN</li>
    </ul>
</div>

jQuery Selector对应的图像和li

1 个答案: