光滑滑块slickAdd添加了多个

Question

我的布局有4个选项的问题。点击任何答案，它会添加一张新幻灯片并转到该幻灯片。

$(document).on('click', '.goal1 li', function(e){
    $(this).addClass('goal-selected').siblings('li').removeClass('goal-selected');
    $('.slider').slickAdd('<div class="goal2"><h1>Question 2</h1><ul class="goals"><li>Option 1</li><li>Option 2</li><li>Option 3</li><li>Option 4</li></ul><div>');
    setTimeout(function(){
        $('.slick-next').trigger('click');
    }, 500);
});

使用此代码。如果我点击上一个按钮并更改答案，则会添加一个额外的幻灯片，并添加相同的属性。

Fiddle Demo

Answer 1

检查Fiddle

＆＃13;

＆＃13;

public class ListDataFriendsAdapter extends ArrayAdapter<ListDataFriends> implements View.OnClickListener {
  private List<ListDataFriends> FilterData = new ArrayList<>();
private List<ListDataFriends> OriginalData = new ArrayList<>();
Activity activity;

ListDataFriendssFilter mListDataFriendssFilter;

public ListDataFriendsAdapter(Activity activity, List<ListDataFriends> data) {
    super(activity, android.R.layout.simple_list_item_1, data);
    this.OriginalData = data;
    this.FilterData = data;
    this.activity = activity;

}


@Override
public View getView(int position, View view, ViewGroup parent) {
    ListDataFriends friends = getItem(position);
    ViewHolder holder;
    if (view != null) {
        holder = (ViewHolder) view.getTag();
    } else {
        LayoutInflater inflater = LayoutInflater.from(getContext());
        view = inflater.inflate(R.layout.item_sugest_friends, parent, false);
        holder = new ViewHolder(view);
        view.setTag(holder);
    }

    holder.fullName.setText(!TextUtils.isNullOrEmpty(friends.getFullName()) ? friends.getFullName() : "-");
    holder.email.setText(!TextUtils.isNullOrEmpty(friends.getEmailAddress()) ? friends.getEmailAddress() : "-");
    holder.phoneNumber.setText(!TextUtils.isNullOrEmpty(friends.getMobileNumber()) ? friends.getMobileNumber() : "-");

    return view;
}


class ViewHolder {
    @BindView(R.id.photo)
    AvatarView photo;
    @BindView(R.id.full_name)
    RobotoBoldTextView fullName;
    @BindView(R.id.email)
    RobotoRegularTextView email;
    @BindView(R.id.phone_number)
    RobotoRegularTextView phoneNumber;

    ViewHolder(View view) {
        ButterKnife.bind(this, view);
    }
}


@Override
public Filter getFilter() {
    if (mListDataFriendssFilter == null)
        mListDataFriendssFilter = new ListDataFriendssFilter();

    return mListDataFriendssFilter;
}

// Filter

private class ListDataFriendssFilter extends Filter {

    @Override
    protected FilterResults performFiltering(CharSequence constraint) {

        constraint = constraint.toString().toLowerCase();
        FilterResults result = new FilterResults();
        if (constraint != null && constraint.toString().length() > 0) {
            ArrayList<ListDataFriends> filteredItems = new ArrayList<ListDataFriends>();

            for (int i = 0, l = OriginalData.size(); i < l; i++) {
                ListDataFriends country = OriginalData.get(i);
                if (country.getFullName().toLowerCase().contains(constraint))
                    filteredItems.add(country);
            }
            result.count = filteredItems.size();
            result.values = filteredItems;
        } else {
            synchronized (this) {
                result.values = OriginalData;
                result.count = OriginalData.size();
            }
        }
        return result;
    }

    @SuppressWarnings("unchecked")
    @Override
    protected void publishResults(CharSequence constraint,
                                  FilterResults results) {

        FilterData = (ArrayList<ListDataFriends>) results.values;
        notifyDataSetChanged();
        clear();
        for (int i = 0, l = FilterData.size(); i < l; i++)
            add(FilterData.get(i));
        notifyDataSetInvalidated();
    }


}

＆＃13;

$(".slider").slick({
			infinite:false,
			draggable:false,
			useTransform: true,
			speed:900,
			cssEase: 'cubic-bezier(0.23, 1, 0.32, 1)',
			easing: 'ease',
			edgeFriction: 20,
			touchMove:false,
		});
$(document).on('click', 'li', function(e){
    var Cclass=$(this).parent().parent().parent().attr('class').split('_')[1].split(' ')[0];
    var newCclass=parseInt(Cclass)+1;
    
    if(!$(this).siblings('li').hasClass('goal-selected'))
    {
    var addhtml='<div class="goal_'+newCclass+'"><div class="goals-setter"><h1>Question '+newCclass+'</h1><ul class="goals"><li>Option 1</li><li>Option 2</li><li>Option 3</li><li>Option 4</li></ul></div></div>';
	$('.slider').slickAdd(addhtml);
		
    }
    $(this).addClass('goal-selected').siblings('li').removeClass('goal-selected');
	movenext();
});
		
    
    function movenext()
    {
    setTimeout(function(){$('.slick-next').trigger('click');}, 500);
    }
    
    
    

＆＃13;

.slider {
		  width: auto;
		  margin: 30px 50px 50px;
		}
		.slick-slide {
		  background: #3a8999;
		  color: white;
		  padding: 40px 0;
		  font-size: 30px;
		  font-family: "Arial", "Helvetica";
		  text-align: center;
		}

		.slick-prev:before,
		.slick-next:before {
		  color: black;
		}

		.slick-dots {
		  bottom: -30px;
		}

		.slick-slide:nth-child(odd) {
		  background: #e84a69;
		}
		*{
			box-sizing:border-box;
		}
		ul.goals{
			padding:0;
		}
		ul.goals li{
			list-style:none;
			float:left;
			width:50%;
			border:1px solid #fff;
			padding:20px;
			cursor:pointer;
		}
		.slick-slide{
			padding:0 30px 30px;
		}
		.qNav{
			margin-top:30px;
			padding:20px 40px;
		}
		.goal-selected{
			background:tomato;
		}

＆＃13;

＆＃13;

＆＃13;