100分,关于easyui dialog 使用href来加载远程页面,子页面的初始化问题,有简单错误demo

LinuxCard 2015-10-01 02:10:40
母页面:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Dialog - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript">
function opendlg()
{

$('#dlg').dialog({
title: '合并',
width: "80%",
height: 600,
closed: true,
cache: false,
href: 'child.html',
modal: false,

onLoad: init_merge_dialog()
});
console.log("11");
$("#dlg").dialog("open");
console.log("22");
}


function init_merge_dialog()
{

console.log("1");
//$.parser.parse('#tb_merge');

$('#txtInStockTime11').datebox('setValue', '2015-09-01');

}

</script>
</head>
<body>
<h2>Basic Dialog</h2>
<p>Click below button to open or close dialog.</p>
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="opendlg()">Open</a>
</div>
<div id="dlg" ></div>
</body>
</html>


子页面:


<div id="tb_merge" style="padding: 5px 0">
<input id="txtInStockTime11" name="txtInStockTime11" class="easyui-datebox" />
</div>



母页面的功能就是弹出一个dialog,这个dialog的href就是child.html

现在的程序的样子是这样的:


OnLoad中的代码执行了,但是没有在界面上显示出来日期,请问是那里的问题呢?


这个问题纠结了一天了,一直没找到好的方法解决
...全文
1048 12 打赏 收藏 转发到动态 举报
写回复
用AI写文章
12 条回复
切换为时间正序
请发表友善的回复…
发表回复
Hello World, 2015-10-09
  • 打赏
  • 举报
回复
需要等待加载完成并生成DOM时才可以赋值,用循环是正确的。并且在cache=false时重新打开对话框时需要再次赋值,这块需要处理

	<script type="text/javascript">
		function opendlg()
		{
		  $('#dlg').dialog({    
						title: '合并',   
						width: 580,  
						height: 200,    
						closed: true,    
						cache: false,    
						href: 'child.html',    
						modal: false,
					
						onLoad: function(){
							//alert('Fires when remote data is loaded.');
							init_merge_dialog(0);
						},
						onOpen:function(){
							//alert('Fires after panel is opened.');
						},
						onBeforeOpen:function(){
							//alert('Fires before panel is opened, return false to stop the open.');
							//如果不清除,重新打开对话框时不能赋值(cache=false时)
							document.getElementById('dlg').innerHTML='';
						}
					});
					$("#dlg").dialog("open");
		}
		function init_merge_dialog(n)
		{
			//需要等待加载并生成DOM后才执行赋值
			if(document.getElementById('txtInStockTime11')){
				$('#txtInStockTime11').datebox('setValue', '9/1/2015');
			}else{
				//控制循环次数,避免加载错误时死循环
				if(n<5){
					n++;
					setTimeout('init_merge_dialog('+n+')',200);	//重复调用
				}
			}
		}		
	</script>
Go 旅城通票 2015-10-08
  • 打赏
  • 举报
回复
你是立即执行init_merge_dialog将返回值作为onLoad的处理函数,那时ajax都没发送列,当然找不到对象
onLoad: init_merge_dialog////////////////////////////()
NANU-NANA 2015-10-08
  • 打赏
  • 举报
回复
不好意思,这个easyui我没用过。 也许你可以尝试在child.html上添加比如onload之类的操作。
LinuxCard 2015-10-02
  • 打赏
  • 举报
回复
引用 8 楼 u010087908 的回复:
这是一个timing problem。 你这里的onload指的是dialog,不是child.html。 所以在你执行init_merge_dialog(),也就是给datebox赋值的时候,input还未加载。 你可以通过
		function init_merge_dialog()
		{
		setTimeout(function(){
		console.log($('#txtInStockTime11'));
$('#txtInStockTime11').datebox('setValue', '9/1/2015');
}, 3000);
			console.log($('#txtInStockTime11'));
            //$('#txtInStockTime11').datebox('setValue', '9/1/2015');
		}
清楚的看到差别。
谢谢你的意见,我也觉得是这个问题,那么有什么好的解决方案吗?用setetimeout总觉得不是一个靠谱的方案
NANU-NANA 2015-10-02
  • 打赏
  • 举报
回复
这是一个timing problem。 你这里的onload指的是dialog,不是child.html。 所以在你执行init_merge_dialog(),也就是给datebox赋值的时候,input还未加载。 你可以通过
		function init_merge_dialog()
		{
		setTimeout(function(){
		console.log($('#txtInStockTime11'));
$('#txtInStockTime11').datebox('setValue', '9/1/2015');
}, 3000);
			console.log($('#txtInStockTime11'));
            //$('#txtInStockTime11').datebox('setValue', '9/1/2015');
		}
清楚的看到差别。
LinuxCard 2015-10-02
  • 打赏
  • 举报
回复
引用 5 楼 u010087908 的回复:
http://jsfiddle.net/etqsat3f/2/ 这是我在jsfiddle上测试的,没有任何问题,可以赋值和取值。
我把错误的demo传上来了,文件在demo\demo\dialog\mother.html 打开直接运行就可以了,谢谢! demo在此,直接下载即可
LinuxCard 2015-10-02
  • 打赏
  • 举报
回复
引用 5 楼 u010087908 的回复:
http://jsfiddle.net/etqsat3f/2/ 这是我在jsfiddle上测试的,没有任何问题,可以赋值和取值。
谢谢,不过你可能没有理解我的意思,我的意思是,赋值语句$('#txtInStockTime11').datebox('setValue', '9/1/2015');是没问题的,但是现在的环境是当dialog加载子页面的时候,这句代码就会失效,语句没有报错,但就是没有效果,而这句代码在console里直接输入,是有效果的
NANU-NANA 2015-10-01
  • 打赏
  • 举报
回复
http://jsfiddle.net/etqsat3f/2/ 这是我在jsfiddle上测试的,没有任何问题,可以赋值和取值。
LinuxCard 2015-10-01
  • 打赏
  • 举报
回复
引用 3 楼 u010087908 的回复:
<input id="txtInStockTime11" name="txtInStockTime11" class="easyui-datebox" >
改成这样也不行..
NANU-NANA 2015-10-01
  • 打赏
  • 举报
回复
<input id="txtInStockTime11" name="txtInStockTime11" class="easyui-datebox" >
LinuxCard 2015-10-01
  • 打赏
  • 举报
回复
引用 1 楼 u010087908 的回复:
$('#txtInStockTime11').datebox('setValue', '9/1/2015');
这样是不行的哦,刚试过了 我发现我的setvalue的语句应该是没有写错的,因为,我在控制台执行这个语句,就可以正确的给datebox 赋值,显示到界面上
NANU-NANA 2015-10-01
  • 打赏
  • 举报
回复
$('#txtInStockTime11').datebox('setValue', '9/1/2015');

87,888

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧