jquery添加select option两种代码思路比较
功能需求:在客户选择了check_in_date和check_out_date之后,将在check_in_date至check_out_date的promotions中自动添加符合条件的promotion list.默认存在一个promotion,Best Available Rate。
初始的代码:
<select id="promotions_list">
<option val="0">Best Avaliable Rate</option>
</select>
方法一实现代码:
function ajaxPrmotion(){
var check_in_hidden = $('#check_in_hidden').val();
var check_out_hidden = $('#check_out_hidden').val();
var adults_num = $('#adult').attr('selected','selected').val();
var child_num = $('#child').attr('selected','selected').val();
var promotion_opt ='';
$.ajax({
url:"reservation.php?action_type=mobile_ajax&check_in="+check_in_hidden+"&check_out="+check_out_hidden+"&adult="+adults_num+"&child="+child_num+"&upd=1",
type : "get",
dataType : "json",
async : false, // false 同步
success: function(result) {
$('#promotion_id11').find('option.after_default').remove();//在添加之前确保只有默认的option,所以先将其他的option remove.
var length = 0;
for(var pro_info in result){
length++;
}
if(length>0){
for(var promotion in result){
promotion_opt += '<option class="after_default" value="' +result[promotion]["room_promotion_id"]+'">'+ result[promotion]["title"]+'</option>';
}
}
}
});
if(promotion_opt)$('#default_promotion').after(promotion_opt);
//ajax获得的json数据返回[注意:有对象和数组两种格式],循环遍历拼接在默认的option后面添加上去.
}
//注:1>中的代码会在返回数据为[]时,执行追加一个<option class="after_default" value="undefined">undefined</option>.
//注:在Chrome F12中的HTML中,选中当前行html,按F2可以直接进入对当前行html代码的编辑状态。
方法二实现代码:
function ajaxPrmotion(){
var check_in_hidden = $('#check_in_hidden').val();
var check_out_hidden = $('#check_out_hidden').val();
var adults_num = $('#adult').attr('selected','selected').val();
var child_num = $('#child').attr('selected','selected').val();
var promotion_opt ='';
var url= "reservation.php?action_type=mobile_ajax&check_in="+check_in_hidden+"&check_out="+check_out_hidden+"&adult="+adults_num+"&child="+child_num+"&upd=1";
$.ajax({
url:url,
type : "get",
dataType : "json",
success: function(result) {
$("select[name=promotion_id]").find("option").remove().end().append("<option value='0'>__($lang_text.best_rate)__</option>");//直接将select下面的option全部去掉,然后追加
var promotion_opt ='';
if (result!='' && result){
for(var promotion in result){
promotion_opt += '<option class="after_default" value="' +result[promotion]["room_promotion_id"]+'">'+ result[promotion]["title"]+'</option>';
}
}
$("select[name=promotion_id]").append(promotion_opt);//再将返回的数据拼接后,追加到select.
}
});
}
jquery添加select option两种代码思路比较的更多相关文章
- Jquery获取select option动态添加自定义属性值失效
Jquery获取select option动态添加自定义属性值失效 2014/12/31 11:49:19 中国学网转载 编辑:李强 http://www.xue163.com/588880/3909 ...
- jQuery插件主要有两种扩展方式
jQuery插件主要有两种扩展方式: 扩展全局函数方式. 扩展对象方法方式. 扩展全局函数方式 扩展全局函数方式定义的插件,即类级别插件,可以通过jQuery.extend()来进行定义.定义格式为: ...
- JQuery 对 Select option 的操作---转载
<select id="selectID" > <option value="1">1</option> <optio ...
- select into from和insert into select from两种表复制语句区别
select into from和insert into select from两种表复制语句都是将源表source_table的记录插入到目标表target_table,但两句又有区别. 第一句(s ...
- Linux添加系统调用的两种方法
前言 系统调用的基本原理 系统调用其实就是函数调用,只不过调用的是内核态的函数,但是我们知道,用户态是不能随意调用内核态的函数的,所以采用软中断的方式从用户态陷入到内核态.在内核中通过软中断0X80, ...
- oracle数据库【表复制】insert into select from跟create table as select * from 两种表复制语句区别
create table as select * from和insert into select from两种表复制语句区别 create table targer_table as select ...
- jQuery 实现图片放大两种方式
jQuery 实现图片放大两种方式 一.利用css样式表实现,多用于后台显示 1.这种比较简单,利用dom元素的hover实现样式切换 <style> img{ cursor: point ...
- JS & JQuery 动态添加 select option
因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...
- 关于MySQL中添加数据的两种方法
下面介绍两种执行SQL命令的方法,并作出相应地总结,第一种介绍一种常规用法,下面进行做简要地分析,首先我们需要执行打开数据库操作首先创建一个MySqlConnection对象,在其构造函数中传入一个连 ...
随机推荐
- jquery clone 获取文本框值得问题
1 clone 出来的文本框 默认不会把原来的事件也带过去 如果使用 $("#").clone(true); true 可以将原来的事件带过去 获取文本框的值 可以使用事件 ...
- java重载(实现同一方法名,不同参数)
背景: 前几天写连接数据库时,因为要执行sql,有的是指向得到所有的执行结果,有的是想根据执行结果获得某一个字段的结果.这时我想通过同一个方法名,不同的参数,获得不同的结果.结果发现java的方法竟 ...
- Django1.8:403错误:CSRF verification failed. Request aborted.
问题:Django 403错误:CSRF verification failed. Request aborted. 原因:需要加cookie验证 解决方法: 1.在view.py中增加 fr ...
- 使用Fiddler发送POST请求
使用Fiddler发送POST请求 在测试过程中,有时会遇到需要修改请求中带的参数,去验证权限的安全问题,但是一些post请求,我们在浏览器中不能直接修改他的参数,然后去提交验证. 而fiddler可 ...
- wordpress 下载主题模板、更新报错 No working transports found解决办法
出错原因是PHP没有开启curl. windows下开启方法如下 1. 将php.ini中的;extension=php_curl.dll前的分号去掉, 2. 将php中libeay32.ll, ss ...
- CentOS 安装 Xamarin官方Mono
预先准备: 服务器可连入互联网 有yum 工具(没什么好说的,如果这个你没装,那重新装个系统吧,debian 等不要看这个,不一样的) wget 工具(可选) yum-uitl 工具包 导入Xamar ...
- JSP标准标签库JSTL
1.什么是JSTL? JSP标准标签库(JSP Standard Tag Library) 2.JSTL标准标签库中的常用标签 JSTL是JSP页面的标签库,实质上是一段Java代码.我们常用的是它的 ...
- hibernate编写流程
1.加载hibernatexml配置文件 2.创建sessionFactory 3.根据sessionFactory创建session 4.开启事务 5.持久化操作 6.提交事务 7.释放资源 其中第 ...
- sqlserver 日期格式化
Sql Server 中一个非常强大的日期格式化函数Select CONVERT(varchar(100), GETDATE(), 0): 05 16 2006 10:57AMSelect CONVE ...
- 学美工、平面设计、UI设计,哪个有前途?
首先,在分析学美工.平面设计.UI设计,哪一个更有前途的时候,先要对三类设计有一个大概的了解. 比如“学美工.平面设计.UI设计是什么”等知识,才能更好地去进行选择. 01 阐述美工.平面设计.UI设 ...