I'm a newbie to coding, and I wanted to know how to use chrome.storage.local to store variables.
This is my HTML and javascript code(its a very basic version of what I want)
chrome.storage.sync.set({'value': document.getElementById("userInput").value}, function() {
// Notify that we saved.
})
chrome.storage.local.get(['value'], function(result) {
OnTaskPage=result.key;
document.getElementById("userInput").value = result;
});
<body>
<h1 id="userInput">What site do you want to stay on?</h1>
<input type="text" value="">
</body>
<script src="content.js"></script>
I'm pretty sure I'm messing up the javascript, but I don't know where because I am new to the syntax, and pretty much have no clue what I'm doing. The point of the javascript code is to store the value inside the html text box. Can someone please help me? Thanks!
Problems:
The id should be on input element, not on h1.
result is an object so to access the value you need to read result.value, look for tutorials on using JavaScript objects.
Currently you clear the saved value first by using set() with an empty value, and then read that empty value. You probably don't need set() here, but rather in some other event like a click on a button element.
The script content.js is named ambiguously/incorrectly because content scripts are for web pages, not for the extension page, so it should be named differently, e.g. popup.js
chrome.storage.local.get({value: ''}, result => {
OnTaskPage = result.value;
document.getElementById('userInput').value = result.value;
});
document.getElementById('save').onclick = () => {
chrome.storage.sync.set({value: document.getElementById('userInput').value});
};
and html:
<body>
<h1>What site do you want to stay on?</h1>
<input id="userInput">
<button id="save">save</button>
</body>
<script src="popup.js"></script>
Related
I modify a code like that, for click a checkbox.
Such as,
Is there a any problem about button name or id. I could see just name and class. Is this a problem for work?
<html>
<head>
</head>
<body>
<button>Giris</button>
</body>
<script type="text/javascript">
var chkA5 = "button" class=formCheckBox type=checkbox value=ON name=chkA5
window.onload = function() {
document.getElementById("chkA5").checked = true
});
}
</script>
</html>
I copied all chechbox button properties on web site (F12 + Slect Element + click to check box) and pasted in my script. But I really confused, when I write a code in script, describing works for new things which I add or create. On this web site which I want to click a chechbox on has already buttons and text/check box. How can I create a connect with each other my scrips and web site.
In brief; I couldn't connect my scripts to web site's button and because of that I couldn't do any operation. Am I right?
How can I solve this problem? On picture which I shared, there are some code marked in a red square. This code works for desciribe some element in my scribs?
When we use document.get.ElementById().checked =true, on web site's element properties's has not a id? It has name and class.
Problem 1: getElementById should be getElementByName
Based on your screenshot, the input item you are trying to reference is:
<input name="chkA5" class="formCheckBox" type="checkbox" value="ON"></input>
and you are trying to getElementById()
document.getElementById("chkA5").checked = true
However, there is no id declared, so you will have to get the item by the name, using getElementByName():
document.getElementsByName("chkA5")[0].checked = true;
Problem 2: Your javascript has errors
This line will cause your script block fail:
var chkA5 = "button" class=formCheckBox type=checkbox value=ON name=chkA5
If you require a complete code sample, here is an example:
<html>
<head>
</head>
<body>
<input name="chkA5" class="formCheckBox" type="checkbox" value="ON"></input>
</body>
<script>
(function() {
document.getElementsByName("chkA5")[0].checked = true;
})();
</script>
</html>
Note: Make sure that the script block is at the end of your html, like in your example code provided.
I feel a bit silly asking this question, since most of the questions people ask on here are way beyond my level as a programmer, but at least I know I'm in good hands as far as asking goes. I used to know how to make simple vbscript and javascript programs, but I'm a bit rusty. I'm trying to refresh myself, and despite repeated google/other searches, can't recall how to make it so that when a button is clicked, a msgbox appears. Also, I'd like to know how to modify the .value attribute of a textbox. I'm attempting this in vbscript for now, but I'll try javascript if anyone knows a way to do it in that instead. My ultimate goal is a text based type game where you can click buttons labeled, "north,south,west,east", and make it like an rpg. The textbox would display the current room description.
Here's the code I have so far, which isn't displaying the msgbox.
<html>
<title>Explor-o-Rama!</title>
<body>
<form name = frmMain>
<textarea name = "txtDisp" rows = "10" cols = "50"></textarea><br>
<input type = "button" name = cmdTest value = "test">
</form>
<script language = "vbscript">
sub cmdTest_OnClick
msgbox "test"
end sub
<script>
</body>
</html>
You have:
msgbox "test"
The correct command is:
MsgBox("test")
OR
X=MsgBox("test")
This SHOULD DO IT.
also, <html><body><script language=vbscript>msgbox "" </script></body></html> not works.
but this code works OK:
<html><body><script>alert('Test');</script></body></html>
<html>
<body>
<script>
function test()
{
alert('Test');
}
</script>
<input type = 'button'; onclick='test()'>
</body>
</html>
Probably, it's a IE internal bug.
I am trying to add a hotel search on my website. The hotel search is created by HotelsCombined and they have given me this code to show the hotel search:
<script type='text/javascript' src='http://hoteles.gangatravel.es/SearchBox/297018'></script>
But I've put the code in my html and does not work, anyone know how I can load the script? I tried it with an iframe and does not work either.
Well, what exactly do you want it to do?
I can show you the general idea. That is: the script puts a variable HCSB in the memory. That variable has properties (= variables of an object) and methods (= functions of an object)
<script src="http://hoteles.gangatravel.es/SearchBox/297018"></script>
<script>
// by loading this script, you get a variable HCSB
// so, an example of a variable dump of HCSB
function var_dump() {
for (i in HCSB) {
log(i +': '+ HCSB[i]);
}
}
function log(text) {
document.getElementById('log').innerHTML += text + '<hr>';
}
</script>
<input type="button" value="var dump" onclick="var_dump()">
<div id="log"></div>
EDIT: I presume you want something like this: http://hoteles.gangatravel.es/
You want such a form on your site. But would you mind elaborating a little more?
Oh yes, forget iframe. This is an javascript API.
I am completely new to jQuery. I can't find any good documentation on the get function and was wondering if I could get some help.
I have an HTML page called me.html with just a single div called me. I want to use the following page to get the contents within the div. Even a google in the right direction would help. Thanks so much
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="data.js"></script>
</head>
<body>
<form id="form" runat="server">
<div>
<div id="me">
</div>
</div>
</form>
</body>
</html>
you don't need to use get(). This simple script should do it
<script>
var contentsOfMe = $('#me').html();
</script>
get is used for loading data from an url. You seem to be wanting to get the contents of a div
as in $("#me").text()
What about using the great documentation provided at http://api.jquery.com/jQuery.get/
EDIT. If you want to just get the text, use var myText=$('#me').html();, and if the html, use var myHtml=$('#me').html();
You will find the documentation for the function get here : http://api.jquery.com/jQuery.get/
But get is to perform an ajax request get on your server so I don't think that's what you need.
In jquery, most of the time you will "select" an element using jquery selector : $("#id")
This will select $(), this will say you are selecting an element using his id $("#name_of_the_id").
Then, you will have an object which will represent the selected element.
If you want to get all the html inside this element do :
function getHtmlFromElementId(id)
{
var element = $("#" + id);
var html = element.html();
return html;
}
Printing the return of this function will print all html code inside the element selected.
If you are seaching for a good tutorial on jquery, the w3schools' one is really good:
http://www.w3schools.com/jquery/jquery_examples.asp
I'm at my first hackathon and trying to finish my project. I am very very new the javascript... everything I know I literally learned in the last 2 hours. That being said...
So I know that eval is not the greatest thing to use, but I'm trying to write a simple program in which you can input a javascript snippet into a textarea, click an execute button, and have the javascript execute inside another textarea. I'm trying to stay away from jquery for now, because I want to get the really basic idea down before I add another level of complexity, which is why I'm not using id's.... but if jquery is the only way to do this, then I guess I'll have to pony up and learn it in the next 8 hours.
Code as follows (ish):
function executeJS ()
{
var result = eval(game.input.value);
game.execute.value=result;
}
<head>
<body>
<H1>PRogram</H1>
<form name="game">
<textarea name="execute" rows="5" cols="30" value=""></textarea><br>
<textarea type="text" name="input" rows="10" cols="30" value=""></textarea>
<input type = "button" value = "guess" onclick = "executeJS()</input>
</form>
</body>
</head>
I'm not getting an output in my execute box.
Any insight would be much appreciated.
"game" isn't a variable. it's a DOM element name.
if you want to get it's object, give it an id let's say "game", and use document.getElementById('game')
Note that your <head> surround the <body>
Your javascript code isn't inside <script></script tag.
Here is a working version. However, I would reconsider your idea of not using IDs or libraries:
function executeJS() {
var game = document.forms['game'];
var result = eval(game.input.value);
game.execute.value = result;
}
And be wary of eval.