大家帮小弟我实现一个jquery+ajax的功能
日期：2014-05-17 浏览次数：21007 次
大家帮我实现一个jquery+ajax的功能。
就是在一个页面，有一个添加按钮,点击添加，弹出一个页面上有一表单，在页面表单，填写表单，添加后，在父页面可以实现信息添加
以行的形式添加.就是子窗口一添加信息，父窗口就添加一行信息，这信息是子窗口填的。
------解决方案--------------------
你可以在父页面定义一个方法，该方法用处理将子页面的信息添加到父页面；这个方法应该要有参数传进去，传的参数就是你子页面的信息，你在子页面用过parent.xxx(...),就可以将子页面的信息添加到父页面了
------解决方案--------------------
楼上正解，补充下，加个监听事件，子窗口关闭前将值传回父窗口，父窗口DIV里异步刷新，用innerHTML
------解决方案--------------------
正好刚做过这个，说一下思路吧
父页面弹出子窗口用window.open()就行了，子页面实现自己的操作
父页面写一个调用的方法如addProduct(productID)用来在父页面中显示,
单击子页面按钮时在子页面中调用父页面方法window.opener.addProduct(传子页面的值)
------解决方案--------------------
我用easyui做了一个项目，也有弹出页面，但这个页面是个div。
具体你可以看看easyui的window，很方便
------解决方案--------------------
可以考虑下jquery的弹出层
然后点查看按钮时 就用jquery的选择器将内容显示出来就ok
------解决方案--------------------
------解决方案--------------------
有ajax技术，子页面填写完成一条就给父页面回写一条
------解决方案--------------------
------解决方案--------------------
我把我做的项目简略改了，jquery和easyui的js自己去网上下，easyui有帮助文档
<html>
<head>
<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
<script>
$(document).ready(function(){
$('#ws').window({
collapsible:true,
minimizable:false,
maximizable:false,
resizable:false,
closable:true
});
$('#ws').window('close'); //默认先关闭弹出层
});
function que(){
//弹出层填写内容放到beizhu层
document.getElementById("beizhu").innerHTML=document.getElementById("beizhu_fz").value;
$('#ws').window('close');
}
function dk(){
$('#ws').window('open');//打开弹出层
}
</script>
</head>
<body>
<a href="#" onclick="dk()">打开弹出层</a><br/>
<div id="beizhu"></div>
<div id="ws" class="easyui-window" title="辅助工具" icon="icon-tools" style="width:600px;height:300px;padding:5px;background: #fafafa;" >
<div class="easyui-layout" fit="true">
<div id="input" region="center" border="false" style="padding:10px;background:#fff;border:1px solid #ccc;">
<div region="center" border="false" id="dfd">
<input type="text" id="beizhu_fz">
</div>
<div region="south" border="false" style="text-align:center;height:30px;line-height:30px;">
<input type="button" value="确认" onclick="que()" id="queren">
</div>
</div>
</div>
</div>
</body>
</html>
------解决方案--------------------
就是在一个页面，有一个添加按钮,点击添加，弹出一个页面上有一表单，在页面表单，填写表单，添加后，在父页面可以实现信息添加
以行的形式添加.就是子窗口一添加信息，父窗口就添加一行信息，这信息是子窗口填的。
------解决方案--------------------
你可以在父页面定义一个方法，该方法用处理将子页面的信息添加到父页面；这个方法应该要有参数传进去，传的参数就是你子页面的信息，你在子页面用过parent.xxx(...),就可以将子页面的信息添加到父页面了
------解决方案--------------------
楼上正解，补充下，加个监听事件，子窗口关闭前将值传回父窗口，父窗口DIV里异步刷新，用innerHTML
------解决方案--------------------
正好刚做过这个，说一下思路吧
父页面弹出子窗口用window.open()就行了，子页面实现自己的操作
父页面写一个调用的方法如addProduct(productID)用来在父页面中显示,
单击子页面按钮时在子页面中调用父页面方法window.opener.addProduct(传子页面的值)
------解决方案--------------------
我用easyui做了一个项目，也有弹出页面，但这个页面是个div。
具体你可以看看easyui的window，很方便
------解决方案--------------------
可以考虑下jquery的弹出层
然后点查看按钮时 就用jquery的选择器将内容显示出来就ok
------解决方案--------------------
------解决方案--------------------
有ajax技术，子页面填写完成一条就给父页面回写一条
------解决方案--------------------
------解决方案--------------------
我把我做的项目简略改了，jquery和easyui的js自己去网上下，easyui有帮助文档
<html>
<head>
<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
<script>
$(document).ready(function(){
$('#ws').window({
collapsible:true,
minimizable:false,
maximizable:false,
resizable:false,
closable:true
});
$('#ws').window('close'); //默认先关闭弹出层
});
function que(){
//弹出层填写内容放到beizhu层
document.getElementById("beizhu").innerHTML=document.getElementById("beizhu_fz").value;
$('#ws').window('close');
}
function dk(){
$('#ws').window('open');//打开弹出层
}
</script>
</head>
<body>
<a href="#" onclick="dk()">打开弹出层</a><br/>
<div id="beizhu"></div>
<div id="ws" class="easyui-window" title="辅助工具" icon="icon-tools" style="width:600px;height:300px;padding:5px;background: #fafafa;" >
<div class="easyui-layout" fit="true">
<div id="input" region="center" border="false" style="padding:10px;background:#fff;border:1px solid #ccc;">
<div region="center" border="false" id="dfd">
<input type="text" id="beizhu_fz">
</div>
<div region="south" border="false" style="text-align:center;height:30px;line-height:30px;">
<input type="button" value="确认" onclick="que()" id="queren">
</div>
</div>
</div>
</div>
</body>
</html>
------解决方案--------------------
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
