自测魅族手机webview加载h5时ul嵌套li标签js失效问题记录

自测魅族手机ul嵌套li标签js失效问题:可采用div嵌套option实现

样式:

.hot_list {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}

.hot_list option {
   text-align: center;
   width:30%;
   padding: .16rem .34rem;
   border:0.1rem solid #9F9F9F;
   /*background-color: #efeff4;*/
   border-radius: .27rem;
   font-size: 0.9rem;
   margin-top: .5rem;
   box-sizing: border-box;
}
.hot_list option.hot_shop{
   border:1px solid dodgerblue;
}

数据动态渲染

var showPro=["有","效","沟","流","通"];
var html = '';
for (var i=0;i '+ showPro[i] + '';
}
document.getElementById('radioselectlist').innerHTML = html;
$("#radioselectlist").on("click","option",function(){
   console.log("$(this).attr(\"value\")"+$(this).attr("value"));
   $(this).toggleClass('hot_shop');
});

点击事件之后获取最终逗号分隔字符串

$(".hot_list option").each(function(){
   if($(this).hasClass('hot_shop')){
      console.log("impres",impression);
      impression+=$(this).html()+","
   }
});

你可能感兴趣的:(混合app,前端开发)