I am loading a webview and on dom-ready I execute a function inside the webview like this:
webview.executeJavaScript("$('body').css({'left': '" + left + "', 'top': '" + top + "' })" );
The problem is that webview cannot find reference to $. But I have jquery in my project. What could be the problem ?
Check out this stackoverflow question. You might just need to tell webview that you want to execute JQuery with something like this:
webview.executeJavaScript("jquery:function($('body').css({'left': '" + left + "', 'top': '" + top + "' }))" );
Related
I'm working on online SharePoint site, where I want to have Table of Contents on my pages. It went successful, but I'm not satisfied with links to headers, which are in this style: PageName#heading_[number], where I would like to have PageName#{headingName}.
Is it possible? Here is link to my script: https://pastebin.com/MVsJf0hr . I suppose that it must be written somewhere here:
$(this).attr("id", "heading_" + i);
$("#theTOC").append("<a href='#heading_" + i + "' title='" + theLevel + "'>" + theLevelString + " " + $(this).text() + "</a><br />");
I need to replace one link from javascript with php link.
javascript line:
'<a href="' + res.attachment.guid + '" target="_blank">
php :
echo '<a href="' . wp_get_attachment_url($value->ID) . '" target="_blank">
javascript context:
if (res.success) {
$('.no_file_upload').remove();
var template = '<li class="attachment-' + res.attachment.ID + '">' +
'<p>' + res.attachment.post_title + '<span>' +
'<i class="fa fa-cloud-download" aria-hidden="true"></i>' +
'<i class="fa fa-times" aria-hidden="true" data-post-id="' + res.attachment.ID + '" data-project-id="' + res.attachment.project_id + '" data-file-name="' + res.attachment.post_title + '"></i>' +
'</p></span>' +
'<span>' + res.attachment.post_date + '</span>' +
'</li>';
I tried this way but fail:
<?php echo '<a href="' . wp_get_attachment_url($value->ID) . '" target="_blank"> ?>
So my Wordpress site is uploading all the files to Amazon S3 using WP Offload S3 Lite plugin. I had to alter some of the template files to manage to show the proper Amazon S3 link on website, I had change href links with wp_get_attachment_url($value->ID). The only thing left is one javascript file with that content that is still loading wrong download link. I need to make it work.
I think better you use file name instead of attachment url. get_attached_file( $data->ID )
https://developer.wordpress.org/reference/functions/get_attached_file/
also you can use https://wordpress.org/plugins/amazon-s3-and-cloudfront/ for correct url
for 1.
when you have file name you can generate your own link with a custom function.
Please let me know if there is any issue.
javascript line
<a href="' + cloudfront_url + res.attachment.guid + '" target="_blank">
Complete Javascript
var cloudfront_url = 'https://your_unique_id.cloudfront.net/'
if (res.success) {
$('.no_file_upload').remove();
var template = '<li class="attachment-' + res.attachment.ID + '">' +
'<p>' + res.attachment.post_title + '<span>' +
'<i class="fa fa-cloud-download" aria-hidden="true"></i>' +
'<i class="fa fa-times" aria-hidden="true" data-post-id="' + res.attachment.ID + '" data-project-id="' + res.attachment.project_id + '" data-file-name="' + res.attachment.post_title + '"></i>' +
'</p></span>' +
'<span>' + res.attachment.post_date + '</span>' +
'</li>';
}
You're trying to mix Javascript & PHP code. That is possible but let me explain how it works. PHP code is executed on server side & Javascript is executed on client side.
So, if you write down any php code in the javacsript code, it'll be executed at the time the HTML page is sent by the server to the user. Once the page is loaded, you can't call any PHP function inside the javascript code.
The PHP code is executed in the server before executing the JavaScript client side, the only way in your case is by using AJAX call to get the download link from the server.
In the other hand, there is an option to write JavaScript inside PHP, but not the inverse.
I want to get the HTML code of a webpage after it has been modified (similar to one that we see in inspect element tab of a browser) and I want to do it programatically (if possible using python or any other programming language). Can someone suggest how I might be able to proceed with this? I know its possible since browsers are able to do it.
As the server has no access to client window after client-side changes, you have to use client side languages.
In jquery:
var fullCode= "<html>" + $("html").html() + "</html>";
if you want also to include the Doctype:
var node = document.doctype;
var fullCode = "<!DOCTYPE "
+ node.name
+ (node.publicId ? ' PUBLIC "' + node.publicId + '"' : '')
+ (!node.publicId && node.systemId ? ' SYSTEM' : '')
+ (node.systemId ? ' "' + node.systemId + '"' : '')
+ '>';
fullcode += "<html>" + $("html").html() + "</html>";
Thanks to this
Using JQuery you can achieve this by the following code
$(document).ready(function(){
var html = "<html>"+$('html').html()+"</html>";
});
I want to add a clickable YouTube video's image to my blog. I used the following code:
if (vidid == ""){
var imgvid ="<a href='" + pURL + "#post-title" + "' title='" + pTITLE + "'>"
+ '<img class="no-thumbnail" src="img.youtube.com/vi/undefined/default.jpg"; />'
+ "</a>";
}else{
var imgvid ="<a href='" + pURL + "#post-title" + "' title='" + pTITLE + "'>"
+ '<span class="play-button"></span><img class="'+ vidid
+ '" src="img.youtube.com/vi/'+vidid
+ '/default.jpg"; width="196px" height="147px"/>' + "</a>";
};
div.innerHTML = imgvid + '<div class="truncated-title"><h2>'
+ post_URL+'</h2></div>';
}
But it's not working. How can I resolve this?
Did you try using the YouTube integration API? You can get some more info in the documentation here and here. Using it that way, Youtube will automatically generate and show the preview image, player controls etc.
Additionally, there might already be an extension for showing Youtube Videos on your blog - do you use Wordpress or a different standard Blogging platform?
Edit
Now that I know you are using Blogger - you should be able to add the youtube video to any post by default, please refer to this manual for details.
I got some troubles working on javascript for an Firefox OS app, so I hope anyone can help me.
The case is I append some images from javascript (see code)
var aux = "<img class=\"imageOn\" id=\"" + imageName + "\"" + "src:\"" + imageURL + "\" >";
var image = "<a class=\"imageOn\" href=\"#\"> " + aux + " </a>";
$("#categoriasList").append(image);
$('#'+imageName).attr('src',imageURL);
And now I want to select one of these images from another js file:
$("img.imageOn").bind('click', function(e) {
console.log($(this).attr('id'));
playText($(this).attr('id'),"es");
// Change to picturesView
// Load icons from category choosed
});
The point is that actually it isn't working, the event is not triggered, so apendding or selecting the images has to be wrong, but I don't find the error. Does anyone know how to fix it?
Thank you in advanced.
Your src attribute should be followed by a = not a :
"<img class=\"imageOn\" id=\"" + imageName + "\"" + "src=\"" + imageURL + "\" >";
This
"src:\"
Should probably be
"src=\"
You need a = instead of : in your src. Try this:
"<img class=\"imageOn\" id=\"" + imageName + "\"" + "src=\"" + imageURL + "\" >";
If your are using jQuery you can use following method.
var aux= $(document.createElement('img')).attr(
'id':imageName,
'src':imageURL,
'class':'imageOn'
),
image = $(document.createElement('a')).attr({
'class':'imageOn'
'href':'#',
});
image.html(aux);
$("#categoriasList").append(image);
And after appending you can attach event handler. If you attaching without creating actual element it will not be triggered. It means if you want to attach event handler in the different file you should be sure that all elements already created. Otherwise there will not be triggered.
I fixed it using the event handler "on" of query