调查报告
by gothic
HTML
<div class="mod research-list">
<div class="mod-head">
<h4>题目</h4>
<ul>
</ul>
</div>
<div class="mod-body">
<a class="btn btn-default add-list"><i class="icon icon-plus"></i> 添加题目</a>
</div>
</div>
JavaScript
$(function(){
var list_num = 0;
$('.add-list').on('click', function()
{
// 添加调查题目
var template = '<li data-id="' + list_num + '" id="list'+list_num+'">'+
'<div class="mod-head">'+
'<div class="aw-type">'+
'<h4>题目</h4>'+
'<input type="radio" name="condition[' + list_num + '][type]" value="" class="single" data-id="' + list_num + '" />'+
'<label for="">'+
'单选</label>'+
'<input type="radio" name="condition[' + list_num + '][type]" value="" class="multiple" data-id="' + list_num + '" />'+
'<label for="">'+
'多选</label>'+
'<input type="radio" name="condition[' + list_num + '][type]" value="" class="custom" data-id="' + list_num + '"/>'+
'<label for="">'+
'填空</label>'+
'<input class="form-control" placeholder="调查题目标题" type="text" name="condition[' + list_num + '][question]" />'+
'</div>'+
'</div>'+
'<div class="mod-body">'+
'<h4>答案</h4>'+
'<ol></ol>'+
'<a class="btn btn-default add-answer"><i class="icon icon-plus"></i> 添加答案</a>'+
'</div>'+
'</li>';
$(this).parents('.research-list').find('.mod-head ul').append(template);
$('.aw-type').on('click','.single',function()
{
if ($(this).attr('checked',true)) {
$(this).val('single');
console.log('.multiple');
$(this).parent().find('.multiple').attr('checked',false);
$(this).parent().find('.custom').attr('checked',false);
$(this).parent().find('.multiple').attr('value', '');
$(this).parent().find('.custom').attr('value', '');
$(this).parent().next('.mod-body').show();
}
});
$('.aw-type').on('click','.multiple', function()
{
if ($(this).attr('checked',true)) {
$(this).val('multiple');
$(this).parent().find('.single').attr('checked',false);
$(this).parent().find('.custom').attr('checked',false);
$(this).parent().find('.single').attr('value', '');
$(this).parent().find('.custom').attr('value',...