2014-09-23 28 views
-1

我动态创建一个按钮,并需要添加到L1标签如何将按钮添加到动态使用jQuery

LI标记这是我的jsfiddle

http://jsfiddle.net/1ty1v8u1/7/

enter image description here

这是我的代码

function showRestaurantDetailsByLocation(response,locationname) 
{ 
$('.restListings').remove(); 
$('.addNewRestaurant').remove(); 
var ulhtml = $('<ul class="restListings"></ul>'); 
var divhtml = $('<div class="inner-intit"><sub class="sub">Your Favorite Area</sub></div>'); 
divhtml.append('<br>'); 
var $newbutton= $('<input/>').attr({ type: 'button', location:locationname , name:'btn1', class:'btn btn-success', value:'Add For'+locationname}); 
var $ordernow= $('<input/>').attr({ type: 'button',name:'btn1', class:'btn btn-success', value:'Order Now'}); 
for(var i=0;i<response.length;i++) 
{ 
divhtml.append('<li><h6>'+response[i].area+'</h6><p>'+response[i].address+'</p></li>'); 
} 
divhtml.append($newbutton); 
divhtml.append($ordernow); 
ulhtml.append(divhtml); 
$("#"+locationname).append(ulhtml); 
} 

我试着用这些选项

var $ordernow= $('<input/>').attr({ type: 'button', name:'btn2', class:'btn btn-success ordernow', value:'Order Now'}); 

divhtml.append('<li class="innerChild" user_location="'+locationname+'" vendor_name="'+response[i].vendor_name+'" vendor_id="'+response[i].vendor_id+'" ><h6> '+response[i].vendor_name+'</h6><p>'+response[i].locality+' , '+response[i].area+' </p><p><b>Timings:</b> '+response[i].start_time+' - '+response[i].end_time+'</p><span class="inDeleteInnerSub"></span></li>'); 

$('<li />').appendTo(ordernow); 

方法2:

divhtml.append('<li class="innerChild" user_location="'+locationname+'" vendor_name="'+response[i].vendor_name+'" vendor_id="'+response[i].vendor_id+'" ><h6> '+response[i].vendor_name+'</h6><p>'+response[i].locality+' , '+response[i].area+' </p><p><b>Timings:</b> '+response[i].start_time+' - '+response[i].end_time+'</p><span class="inDeleteInnerSub"></span>ordernow </li>'); 

方法3:

divhtml.append('<li class="innerChild" user_location="'+locationname+'" vendor_name="'+response[i].vendor_name+'" vendor_id="'+response[i].vendor_id+'" ><h6> '+response[i].vendor_name+'</h6><p>'+response[i].locality+' , '+response[i].area+' </p><p><b>Timings:</b> '+response[i].start_time+' - '+response[i].end_time+'</p><span class="inDeleteInnerSub"></span>'+$ordernow+'</li>'); 

有了这个它被显示为对象对象

+0

需要更多的努力来解释您的问题。你没有提供对问题的解释,或者主题中的预期行为和问题是唯一提出的问题,而且非常含糊。 – charlietfl 2014-09-23 23:19:44

+1

那么它不是我没有试过,我在本地尝试,并不想要把这是网络的代码。无论如何,我会用我试过的东西更新我的问题 – Pawan 2014-09-23 23:21:24

回答

1

如果你只是想要你的“立即订购”按钮在里面NT更改以下行:

原文:

divhtml.append($ordernow); 

修改:

divhtml.children("li").append($ordernow); 

此外,如果你希望你的按钮出现在右边眼前这个CSS属性添加到该按钮:

float:right 

这里是更新的JSFiddle

编辑:

甚至接近你的照片是这样的JSFiddle。我添加了h6和p的容器div,其中css属性为

float:left 
+0

非常感谢,这对我来说帮助很大。 – Pawan 2014-09-24 09:30:33