I have the following code:
<html>
<head>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script>
FB.Event.subscribe('edge.create',
function(response) {
alert('TEST');
}
);
</script>
</head>
<body>
<div id='fb-root'></div>
<fb:like send="true" width="450" show_faces="true" />
</body>
</html>
When I click on like, the alert is not showing up. I have tried the same code before and it seemed to work. Do you see something wrong? I don't see any errors in JS console...I am in localhost.
EDIT:
Here you can see it live: http://jsfiddle.net/jCE5K/
Per http://developers.facebook.com/docs/reference/plugins/like/, you need to have a fb-root DIV tag.
Related
I am new to AJAX and am experimenting with a simple page that should show a txt file into a specific location. At this point it does not show the vlist.txt file.
Question: Why does this code not display the file (vlist.txt)?
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("C:\Users\itpr13266\Desktop\vlist.txt");
});
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2>This is where your text will go</div>
<button>Get External Content</button>
</body>
</html>
New Code that was Tried.
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load(function() {alert( "Load was performed." ););
});
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2>This is where your text will go</div>
<button>Get External Content</button>
</body>
</html>
No alert box was displayed so I am not sure that it is even getting to that point.
$().load() can't be used with a local file path like C:\Users\itpr13266\Desktop\vlist.txt.
Put your file on a web server and your code will most likely work.
I am diving in the deep end of this magic world of HTML. I have the CKEditor woring and myFunction produces the alert. I need to get the HTML of the text in the editor.
I got this from another post:
CKEDITOR.instances.textarea.on( 'instanceReady', function( instanceReadyEventObj )
{
var editorInstanceData = CKEDITOR.instances.textarea.getData();
alert( editorInstanceData );
});
I could not comment or reply to the post as I don't have enough points so I have to ask a duplicate.
I have the alert working and pasted the code in myFunction but I get the error in the console Uncaught TypeError: Cannot call method 'on' of undefined.
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
var htmldata = CKEDITOR.instances.Editor.document.getBody().getHtml();
alert(htmldata);
}
</script>
<title>A Simple Page with CKEditor</title>
<!-- Make sure the path to CKEditor is correct. -->
<script src="http://www.wilsea.com/ckeditor/ckeditor.js"></script>
</head>
<body>
<form>
<button onclick="myFunction()">Click me</button>
<textarea id="editor1" name="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.....
</textarea>
<script>
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'editor1' );
</script>
</form>
</body>
MrWarby
<!DOCTYPE html>
<html>
<head>
<script type="text/javaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://www.wilsea.com/ckeditor/ckeditor.js"></script>
</head>
<body>
<textarea id="editor1" name="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor
</textarea>
<script>
function myFunction()
{
alert('test');
CKEDITOR.instances.textarea.on( 'instanceReady', function( instanceReadyEventObj )
{
var editorInstanceData = CKEDITOR.instances.textarea.getData();
alert( editorInstanceData );
});
}
CKEDITOR.replace( 'editor1' );
</script>
<p>Click the button to trigger a function.</p>
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
</body>
</html>
I've tried moving into different place but I still get the same error.
test page is at http://www.wilsea.com/ckeditor/testckeditor.html
MrWarby.
Before your SCRIPT in HEAD add two more lines:
<script type="text/javaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="/ckeditor/ckeditor.js"></script>
But change path to CkEditor script.
I have a simple file to test onclick function which I copied straight from w3schools' example. It works fine in the Tryit editor, but the button with the onclick function does nothing when I place it on my server.
<!DOCTYPE html>
<html>
<head>
<script>
function open_win()
{
window.open("http://www.<valid address>");
}
</script>
</head>
<body>
<form>
<input type="button" value="Open Window" onclick="open_win()">
</form>
</body>
</html>
Where should I look first?
It does work for me and it is valid code, so I don't know why it's not working for you. But here's an alternative:
<input ... onclick="window.open('http://www.<valid address>');">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
If it still doesn't work then check if you have JavaScript enabled in the browser you are using to access your server.
I've been fighting with this for a while now and have searched extensively to no avail. I grabbed a link someone posted here in response to my same question. enter link description here I've copied the code to my editor, placed the stylesheet inline, linked all the scripts correctly I think...
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"</script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.js"</script>
<style> #docs{
display:block;
postion:fixed;
bottom:0;
right:0;
}
</style>
</head>
<body>
<form id="form_validation_reg_generate_user">
<input type="text" name="userPassword" id="userPassword" />
<br/>
<input type="submit" />
</form>
<a id="docs" href="http://docs.jquery.com/Plugins/Validation" target="_blank">Validation Documentation</a>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script>
$(document).ready(function () {
$('form#form_validation_reg_generate_user').validate({
rules: {
userPassword: {
minlength: 5
}
},
submitHandler: function (form) { // for demo
alert('valid form submission'); // for demo
return false; //form demo
}
});
});
</script>
</body>
No validation occurs... I have a feeling I'm missing something obvious. It was working in a separate page when I was only validating required fields. Since adding the minlength... nothing.
I'm doing a test with your code and it seems to work perfectly. Check if your jquery.validate.min.js path is correct and if you can access properly to every script from your system.
Also you can use your browser development tools to check if you have exceptions.
The jquery.validate.iin.js version I used in the text is from this website. Maybe you have an older script?
I need fadeout a div in my page using prototype. How can I fadeout following jquery code in prototype?
$('.exercise-main .content .loading-failure').fadeOut(function(){
//my code
}
I think you will need to use script.aculo.us (which is an excellent add-on to the fantastic prototype.js) so as to achieve the Fade effect.
Basic Syntax
new Effect.Fade('id_of_element', [options]);
OR
new Effect.Fade(element, [options]);
Complete Code.
<html>
<head>
<title>script.aculo.us examples</title>
<script type="text/javascript"
src="/javascript/prototype.js"></script>
<script type="text/javascript"
src="/javascript/scriptaculous.js?load=effects"></script>
<script type="text/javascript">
function FadeEffect(element){
new Effect.Fade(element,
{ duration:1});
}
function ShowEffect(element){
new Effect.Appear(element,
{duration:1, from:1.0, to:1.0});
}
</script>
</head>
<body>
<div onclick="FadeEffect('hideshow')">
Click me to fade out the image
</div>
<br />
<div onclick="ShowEffect('hideshow')">
Click me to display the image once again
</div>
<br />
<div id="hideshow">
<img src="/images/scriptaculous.gif" alt="script.aculo.us" />
</div>
</body>
</html>
Tutorial link - http://www.tutorialspoint.com/script.aculo.us/scriptaculous_fade_effect.htm
I myself have used prototype.js and this add-on very heavily so just in case you face any issue, feel free to comment.. :-)