How to open multiple url-web-links via custom local .html? - javascript

Once upon a time I encountered a simple but efficent script that allows to paste copied links (line by line) into a box and then after pressing a button it opened all of the links (http://etc.etc) in a new tab.
Unfortunately I have deleted this gem.
Can you help me to make a simple local .html page where user could paste list of urls:
http://url.one
http://url.two
and after pressing a button it will open them url-s in a browser
thats what im looking for:
https://thewindowsclub-thewindowsclubco.netdna-ssl.com/wp-content/uploads/2014/07/urlopener.jpg
closest call is this;
<html>
<head>
<script type="text/javascript">
function open_win() {
window.open("http://www.java2s.com/")
window.open("http://www.java2s.com/")
}
</script>
</head>
<body>
<form>
<input type=button value="Open Windows" onclick="open_win()">
</form>
</body>
</html>
instead of predefined URL-s user should be able to paste own links in form of list

To open a new tab, you would use the javascript command window.open(url,'_blank');, where the URL is a reference to the URL you'd like to open. Here's a refrence for window.open.
For your specific usecase, you'd want to create a HTML document with something like a <textarea> in it, and a submit button. You'd then take the text, split it into an array along newlines, (using String.split), then loop over the result and call the window.open function on each entry.
I hoped this helped!

Here is how to do it
document.getElementById("submit").addEventListener("click", function(){
var urls = document.getElementById("url").value.split(" ");
console.clear();
urls.forEach(function(element){
console.log(element)
window.open(element,'_blank');
});
});
<p>Insert your URl seperated by space </p>
<input type="text" id="url" value="https://www.google.se http://www.icefilms.info/" />
<input type="button" id="submit" value="open" />

Related

HTML JS Open new window with console in google chrome

This is client-side HTML. I'm just using HTML for automation.
My initial goal was to open a new window https://live.ipms247.com/login/ and then paste the values in the three login fields. All three fields have ID tags. And I can write to them from the console. For example.
document.getElementById("username").value="sample";
document.getElementById("hotelcode").value="12345";
document.getElementById("password").value="Password";
I wrote a code to copy text from parent window to child window at the click of a button.
My code is on a local file.
<html>
<head>
<script type="text/javascript">
function init()
{
popupWin = window.open('https://live.ipms247.com/login/','popupWin','');
}
function transferText()
{
popupText = popupWin.document.getElementById("username");
parentText = document.getElementById("parentTextBox");
popupText.value = parentText.value
}
</script>
</head>
<body>
<input type="text" id="parentTextBox" onkeyup="transferText();" value="Hello World">
<input type="button" onclick="init();" value="popup window">
<input type="button" onclick="transferText();" value="Transfer Text">
</body>
</html>
However, this does not work, apparently because my code is on a local file and the website is on another domain.
So my only solution to this problem, so far, is to launch the site with onlick and then focus to it. Press Ctrl+Shift+J to open the console and then paste the commands (I have code which copies them to clipboard) and hit enter.
Is there any possibility to launch the new window with the console open and focus on the console?
You can not do this because JavaScript restricts you to the user.
If you want to reach your goal, you can use the frames API

How edit elements of existing link and open the edited version of the link? (Without saving it localy)

I want to build a html website_A where you can type some data and then open another website_B with a button click and this website_B would be changed according to the text we typed in the first website.
For example we have a website_B example.com with a
<h1 id="xxx">
We save the link in our website_A as a string, insert an input field and button with onClick function:
<input type="text" id="text_id" name="text_name"><br><br>
<input type="submit" value="Open Link!" onclick="openLink()">
<script>
var link = 'example.com';
function openLink() {
link.getElementById("xxx").innerHTML = document.getElementById("text_id").text;
window.open(link);
</script>
}
It should open the link with the changed h1.
Somehow it doesn't work, I don't know the javascript much, not even sure if I can achieve it with js or I have to use some othere languages. I googled a lot and didn't find anything, most information is about changing files locally or changing just the href link, not its elements.
I appreciate your help!

Fill input field inside an iframe when link outside of iframe is clicked

I have been trying to get this to work for 2 weeks now but I am stumped on this which is probably very simple. I am new to js.
I have multiple links on a page along with a form embedded in an iframe. Same domain, same page, both using https. The form is from a form script and is embedded in the page using:
<div id="my_placeholder"
data-formurl="https://www.example.com/forms/embed.php?id=7777"
data-formheight="1268"
data-paddingbottom="10">
</div>
<script src="https://www.example.com/forms/js/jquery.min.js"></script>
<script src="https://www.example.com/forms/js/jquery.postmessage.min.js"></script>
<script src="https://www.example.com/forms/js/form_loader.js"></script>
Using that code it automatically puts the form in an iframe. The input field ID within the form i'd like to fill is #element_11
So far, I have the following code which works exactly as I'd like but the generic form code is not in an iframe
Link1
<br />
Link2
<br />
Link3
<form>
<input type="text" id="element_11" />
</form>
<script type="text/javascript">
function reply_click(element)
{
document.getElementById('element_11').value = element.getAttribute('data-filled-value');
}
</script>
How can I accomplish this? I have searched and searched but every post I've come across wants to target the iframe and "submit" the form or "close" the iframe or "fill in one form and have it go to another form in an iframe".
Use .contents() to access the contents of an iframe.
function reply_click(element)
{
$("#iframeID").contents().find("#element_11").val(element.dataset.filledValue);
}
Replace iframeID with the actual ID of the iframe.

Open an URL and click a button on the newly loaded page

I am just starting to learn Javascript and I want to write a script that redirects to another URL, and after the URL has been loaded , it click on a "Next button and so on.
I am using the following script, which it is executed after a button press in the first html page:
function GoToURLAndClickNext() {
var w = window.open("file:///C:/test_click.html");
w.document.getElementById('button id').click();
}
test_click.html
looks like this:
<!DOCTYPE html>
<html>
<body>
<h1>Test button</h1>
<p>Test </p>
<button type="button" id="button id" onclick="alert('click event occured')">Click here</button>
</body>
</html>
Unfortunately the script does not work... It opens correctly the "test_click.html" document, but it does not automatically click on the "button id".
Is it possible to implement such behaviour? Ideally I would like to navigate over mutliple html pages in a tree-fashion way.
Thanks
z

Open Google page in Javascript

I have the following code to open a google page and type "Hello" in the textbox.
The code opens the page but the textbox is empty.
Does anyone have an idea please ?
Thanks.
<html>
<head>
<script type="text/javascript">
function getValue()
{
var myWindow = window.open("http://www.google.com","_self")
myWindow.title = "Test"
var TextBox = myWindow.document.getElementsByName("lst-ib");
TextBox[0].value="Hello"
}
</script>
</head>
<body>
<form>
<input name="to" type="hidden" value="hoolah" />
<input type="button" onclick="getValue()" value="Get Value!" />
<form/>
</body>
</html>
You cannot:
Access the DOM of a page on a different origin
Access the DOM of a page from JavaScript that was running in the same window before you loaded the new page
What you want is impossible.
(If it was possible, it would be a security problem as your JavaScript would have access to personal data belonging to your visitors and stored on other websites.)
If I understand the question - you want to be able to pass a value to a Google search from your page. Rather than accessing the DOM of an external page - you are just trying to enter a value into the search term box on the google page.
All you have to do is append a query string to the Google url (such as "http://www.google.com?query=searchTerm" and it will pass the value to the search box on the google page.
I have slightly modified your code to show this - not how i would normally do it but I wanted to keep your code in place as much as possible so you can see whats going on.
I added a search term input and the onclick event opens the window and submits the query to Google. It could have been done as a form submit as well. Note that I put the JS at the bottom of the page - increases speed of page rendering - not important for this, but good practise movingforward. I also declared the variables together instead of using 2 'var's as well.
your code (slightly modified).
<html>
<head>
</head>
<body>
<form>
<input id="searchTerm" type="text" value="" placeholder="Search term"/>
<button type="button" onclick="getValue()">Search</button>
</form>
<script>
function getValue()
{
var term,myWindow;
term=document.getElementById('searchTerm').value;
myWindow = window.open("http://www.google.com?query="+term,"_self")
}
</script>
</body>
</html>

Categories