我正在构建一个网页,允许用户在iframe(用户将选择的网页)上方上传图片。
我有两个功能分开工作,但我不能让它们一起工作。
以前有人做过这样的事吗?
修改
以下是我用来允许用户捕获网页的代码;
<script type="text/javascript">
function get(eid) {
var d = document;
var r = d.getElementById(eid);
return r;
}
function loadUrl(){
var url = get('url').value;
get('myiframe').src = url;
}
</script>
<body>
<div id="menu">
<h1>
Image Uploader
</h1>
<form>
<ul>
<li>
<label class="formLable" for="url">URL: </label>
<input id="url" type="text" name="url" value="" />
</li>
<li>
<label class="formLable" for="image">Image: </label>
<input id="image" type="file" name="image" value="Upload Image" />
</li>
<li>
<label class="formLable" for="top">Top (px): </label>
<input id="top" type="text" name="top" value="" />
<li>
<label class="formLable" for="left">Left (px): </label>
<input id="left" type="text" name="left" value="" />
</li>
<li>
<input type="button" value="GO!" onclick="loadUrl();" />
</li>
</ul>
</form>
</div>
<iframe id="myiframe" frameborder="0"></iframe>
以下是我用于图像上传器的内容
<script type='text/javascript'>
$(document).ready(function(){
$('#image_upload_form').submit(function(){
$('div#ajax_upload_demo img').attr('src','loading.gif');
});
$('iframe[name=upload_to]').load(function(){
var result = $(this).contents().text();
if(result !=''){
$('div#ajax_upload_demo img').attr('src',$(this).contents().text());
}
});
});
</script>
<body>
<div id='ajax_upload_demo'>
<div id="image"><img src='blank.gif' /></div>
</div>
<iframe name='upload_to'></iframe>
<div id="menu">
<h1>
Image Uploader
</h1>
<form id='image upload_form' method='post' enctype='multipart/form-data' action='add_avatar.php' target='upload_to'>
<ul>
<li>
<label class="formLable" for="image">Image: </label>
<input type='file' id='file_browse' name='image' />
</li>
<li>
<label class="formLable" for="top">Top (px): </label>
<input id="top" type="text" name="top" value="" />
<li>
<label class="formLable" for="left">Left (px): </label>
<input id="left" type="text" name="left" value="" />
</li>
<li>
<input type='submit' value='Submit'>
</li>
</ul>
</form>
</div>
<iframe id="myiframe" frameborder="0"></iframe>