切换图标Framework7

Question

我有一个带有图标的div，每次点击这里我都想改变它

​

$$('.right').on('click', function() {
  $$("#change-view").html() === '<i id="" class="material-icons">view_column</i>' ? $$("#change-view").html('<i id="" class="material-icons">view_carousel</i>') : $$("#change-view").html('<i id="" class="material-icons">view_column</i>');
})

<div class="right"><a href="#" id="change-view" class="link"><i class="icon 
material-icons">view_carousel</i></a></div>

​

注意:它只适用于第一次单击，但在此之后，它不再改变，我将使用double ($$)来表示Framework7。

Answer 1

给你一个解决办法

​

var $$ = $.noConflict();
$$('.right').on('click', function() {
  $$("#change-view").html() === '<i id="" class="material-icons">view_column</i>' ? $$("#change-view").html('<i id="" class="material-icons">view_carousel</i>') : $$("#change-view").html('<i id="" class="material-icons">view_column</i>');
})

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="right"><a href="#" id="change-view" class="link"><i class="icon 
material-icons">view_carousel</i></a></div>

​

希望这能帮到你。