require:I need to download files from server in mobile.
question:
In pc:
<a href="file.url">
click me to download
</a>
and
<a #click="func"></a>
<script>
function func(){
var myFrame= document.createElement(“iframe”);
myFrame.src = “url”;
myFrame.style.display = “none”;
document.body.appendChild(myFrame);
}
</script>
botn works well,but it can't work well in mobile,how can I realize it?
Related
my web server is a simple html server.
there is no node.js,no php
so i wanna make a zip file by js of the directory "/public_html/alpha"
mainly i wanna zip the alpha folder
I tried the jszip.js and zip.js but didnt work.why i dont know..
Here is the code:
<html>
<head>
<script src="/jszip.js"></script>
</head>
<body>
<p>Works on firefox, chrome , opera >= 15 and IE >= 10 (but NOT in compatibility view).</p>
<button id="blob" class="btn btn-primary">click to download</button>
<script>
var zip = new JSZip();
zip.file("readme.txt", "alpha");
jQuery("#blob").on("click", function () {
zip.generateAsync({type:"blob"}).then(function (blob) { // 1) generate the zip file
saveAs(blob, "hello.zip"); // 2) trigger the download
}, function (err) {
jQuery("#blob").text(err);
});
});
</script>
</body>
</html>
This Code dont even give any result.
Server link : For Check Click Here
Add jquery on header
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
then in script make it like this
$(document).ready(function(){
$("#blob").click(function(){
// bla bla bla your code
});
});
I Have normal html file webview with input and button; i have success to make button paste the text from clipboard when i click on it; i tested the project in google chrome in pc and is working good;
i put the html file in webview with android studio and the app working and i show the page but nothing happing when i click on the button
this is part frome the webview:
webframe.loadUrl("file:///android_asset/index.html")
webframe.settings.javaScriptEnabled = true
webframe.settings.allowFileAccess = true
webframe.settings.domStorageEnabled = true
and this is html cole:
<input class="form-control" id="url_input" type="text" value="" />
<button id="past_btn">
img src="images/copy.svg" width="22px" height="22px" />
</button>
<script>
$('#past_btn').click(function(){
$('#url_input').not(function(){
paste(this) ;
});
});
async function paste(input) {
const text = await navigator.clipboard.readText();
input.value = text;
}
</script>
this html working in Chrome and Mozilla.
Thank You
I am trying to create multiple files upload option.It comes with 2 options.
1) when user clicks on uploaded file name then file should be download.
2) Also just beside each file name delete option has to be there.
I can able to upload and delete files, but I don't have any idea to download uploaded files.
My requirement is when I clicks on File name,that should be go to backend people for download file.
Any idea on how to achieve this?
Here is my code up to upload & delete file:
<body>
<input type='file' id='_file' multiple="multiple">
<div id='files_list'><ul> </ul> </div>
<script>
$("#_file").change(function() {
var ele = document.getElementById('_file');
var result = ele.files;
for(var x = 0;x< result.length;x++){
var fle = result[x];
$("#files_list ul").append("<li class='list_item'> <a href='#'>" +
fle.name + "</a> <span class='remove'>X</span> </li>");
}
$(document).on('click','.remove',function(){
var span_id = $(this.parentNode).text();
//$('.list_item'+span_id+'').remove();
$(this).closest('li').remove();
});
});
</script>
</body>
My app is built with a placeholder where a file is read directly when "load" is clicked.
<button id="loadbutton" type="button" class="btn btn-success" onclick="showTheFile()">Load</button></a>
showthefile() does some stuff and then makes a call to...
var keyMapLoc = '\\path\\to\\file.txt';
function readKeys(ffile) {
// read the keyfile
var ffile = ffile || keyMapLoc;
return fs.readFileSync(ffile, 'utf8');
}
This reads the file into the app where it is parsed, yotta yotta.
I followed these instructions and used the demo. The file dialog pops as soon as the app is opened, which I get.
<html>
<body>
<input style="display:none;" id="fileDialog" type="file" />
<script>
function chooseFile(name) {
var chooser = document.querySelector(name);
chooser.addEventListener("change", function(evt) {
console.log(this.value);
}, false);
chooser.click();
}
chooseFile('#fileDialog');
</script>
</body>
</html>
However, even though I understand how to make a file dialog pop and I understand how to read/parse a file, I'm having a hard time working this very abstract example into my existing nwjs app.
Based on the above sample of my app, how should I blend in the demo so that the "load" button operates as expected for loading a file?
Since you didn't provide your code, I'll go off the demo. What you need to do
is trigger the click event of the file input element and then upon a
change event, call readKeys().
<!DOCTYPE html>
<html>
<body>
<input style="display:none;" id="fileDialog" type="file"/>
<button id="loadButton" type="button" class="btn btn-success"
onclick="showTheFile()">Load</button>
<script>
var fs = require('fs');
var keyMapLoc = '\\path\\to\\file.txt';
var chooser = document.querySelector("#fileDialog");
// Set up the file chooser for the on change event
chooser.addEventListener("change", function(evt) {
// When we reach this point, it means the user has selected a file,
// so invoke readKeys().
// this.value contains the path to the selected file
console.log(readKeys(this.value));
}, false);
function showTheFile() {
// Trigger click event on the chooser, this will bring up the
// dialog
chooser.click()
}
function readKeys(ffile) {
var ffile = ffile || keyMapLoc;
return fs.readFileSync(ffile, 'utf8');
}
</script>
</body>
</html>
I have an web page which is a profile viewing page. Here I have an blank image. On click of this image I am able to prompt browse image option. But I don't know how to save the image into storage. Here is my code:
<div class="profileImage" >
<ul>
<li style="margin-top:5px;">
.Hii
</li>
<li>
<input type="file" id="my_file" style="display: none;" />
</li>
<li>
<img id="fileupload" name="filetoupload" src="../../static/img/img.png">
</li>
</ul>
</div>
$(document).ready(function(){
$("#fileupload").on("click", function() {
$("#my_file").click();
}
I tried this below jQuery to save image but is was of no use.
$(document).ready(function(){
$("#fileupload").on("click",function(){
$("#my_file").click();
userImage = document.getElementById('fileupload');
imgData = getBase64Image(userImage);
localStorage.setItem("imgData", imgData);
});
});
My requirement is I should be able to save the image from clicking add image i.e img.png in my code. I am using beego as web framework, but i will be happy if this get solved in jQuery or javascript.
jsBin demo
// https://stackoverflow.com/a/17711190/383904
function readImage() {
if ( this.files && this.files[0] ) {
var FR= new FileReader();
FR.onload = function(e) {
localStorage.setItem("imgData", event.target.result); // Send to Localstorage
};
FR.readAsDataURL( this.files[0] );
}
}
$(document).ready(function(){
$("#fileupload").on("click",function(){
$("#my_file").click().change( readImage );
});
});
To save that image on server you'll need to send that data to PHP.
PHP can than convert your base64 string to an image.
Otherwise, why not simply send that image using AJAX to a PHP script that will put it inside a server folder?
Send Image to server using File input type
https://stackoverflow.com/a/17711190/383904