We Keep Coding

Switch focus to new browser tab once it is opened

I the below script, once the button is pressed, a new browser tab with Google is opened. I then want to fill the search box on this newly opened tab.
How do I switch focus to this new tab, so that I can wait for it to load completely and then fill the search box?
<button id="start">Google</button>
<script>
function open_google_in_new_tab() {
var url = "https://www.google.com";
window.open(url);
window.onload(fill_search_box()); // here it will try to operate on the old tab
};
function fill_search_box() {
var search_box = document.getElementsByName("q")[0];
search_box.value = "Some text";
};
var start_button = document.getElementById("start");
start_button.addEventListener("click", open_google_in_new_tab);
</script>

You can't exactly target another element in another document from your script, however, you can set the textbox value of the Google textbox using a query string:
www.google.com?q=SearchTerm
When creating the SearchTerm you should also use encodeURI to ensure that your attached search query meets URL standards
Also, if you wish to open the window in another tag you can use window.open(url, "_blank") to open.
See example below:
Note:- The page will not open due to snippet restrictions - so run in your own browser.
<button id="start">Google</button>
<script>
function open_google_in_new_tab() {
var text = "Some text";
var url = "https://www.google.com?q=" + encodeURI(text);
console.log(url)
window.open(url, '_blank');
};
var start_button = document.getElementById("start");
start_button.addEventListener("click", open_google_in_new_tab);
</script>

You cannot do that with Javascript unfortunately.
However, this might make you achieve something similar if you are willing to try.
You can manipulate the search string via parameter named "q" in the query string of the Google website. So, in order to make the user to go the Google and search this particular word, you attach the keyword to it. Something like this:
var url = "https://www.google.com?q=searchKeyword";

How to ask permision so others can open mailto

I'm trying to open mail on click in js. I'm using mailto, but in chrome you need to change the handlers settings to make it work.
My question is can I make some sort of popup that ask for persmission and changes this setting to others?
PS: to give permision for me I only found this way:
Open Gmail in Chrome and click the Protocol Handler icon overlapping-diamonds in your browser's address bar.
When prompted to "Allow Gmail to open all email links?", select "Use Gmail," and click "Done."
EDIT
My code to send the mail
$("#applyText").click(function(){
var email = 'mail#gmail.com';
var subject = 'Hire me im a genius';
var emailBody = 'Hi Sample,';
document.location = "mailto:"+email+"?
subject="+subject+"&body="+emailBody;
});

this is browser settings specific, ie. it will behave differently depending on the user's browser settings. The user can change how mailto: links behave in chrome by visiting chrome://settings/handlers, or Chrome Settings->Content Settings->Manage Handlers...
This is an answer to that question.
So to answer your question
No it is not possible because this is browser settings.
But most browsers should open it without a problem. For me this works properly.
By the way, you have some minor mistakes in your code.
Here is an working example
$("#applyText").click(function() {
var email = 'mail#gmail.com';
var subject = 'Hire me im a genius';
var emailBody = 'Hi Sample,';
document.location = "mailto:" + email + "?subject=" + subject + "&body=" + emailBody;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="applyText">Click</button>

Force mailto tag so it executes correct function after DOM load

My website has my email address on which people started using to send spam mails to. So I decided that I need to upgrade security for email addresses on the website.
I changed the website that you have to click on an email address in order to view it (or to click on it to open the mail client).
The unprocessed HTML looks like this:
<a href='#' address='mailto:person(at)example(dot)co(dot)za'>Click here to view</a>
The JavaScript looks like this and is executed on window.load
$("a[address]").click(function (event) {
event.preventDefault();
var address = $(this).attr("address");
while(address.indexOf("(at)") !== -1){address = address.replace("(at)", "#")}
while(address.indexOf("(dot)") !== -1){address = address.replace("(dot)", ".")}
$(this).attr("href", "mailto:" + address);
$(this).html(address);
})
The user clicks on the a tag. The email address displays correctly.
But if I click it again (remember that the href is now mailto:) it does not open the mail client.
How can I force the browser to update the initial on-click event for a mailto tag.

If you want clicking on the link to cause the link to be followed, don't say event.preventDefault();.

Well I found a solution. I added the following code to the end of the JS:
$(this).unbind("click");
This is because the click is still bound after the tag is clicked the first time. It would be interesting still to know if there is a way to "force" open the mail client using JS.
The new JS code looks like this:
$("a[address]").click(function (event) {
event.preventDefault();
var address = $(this).attr("address");
while(address.indexOf("(at)") !== -1){address = address.replace("(at)", "#")}
while(address.indexOf("(dot)") !== -1){address = address.replace("(dot)", ".")}
$(this).attr("href", "mailto:" + address);
$(this).html(address);
// this is the new code
$(this).unbind("click");
})

You can check if the element has an attribute and remove it once it has been clicked, then only preventDefault when the attribute is present.
$("a[address]").click(function (event) {
if($(this).attr('address')){
event.preventDefault();
var address = $(this).attr("address");
while(address.indexOf("(at)") !== -1){address = address.replace("(at)", "#")}
while(address.indexOf("(dot)") !== -1){address = address.replace("(dot)", ".")}
$(this).attr("href", "mailto:" + address);
$(this).html(address);
$(this).removeAttr('address');
}
});

insert a image into outlook

my site has a "send" button to send email, I want to send some email(outlook) fill with some existed info from my site.
for example, I want a logo image show in the email body,how can I get that?
here is my html and js:
<a id="email" target="_blank" href="">send email</a>
<script>
$('#mail').click(function() {
var link = "mailto: some" + "?cc=cc" + "&subject=subject" + "&body = '"+ ??+"'";
window.location.href = link;
return false;
});
</script>

You cannot do that with a "mailto" url. You will need to either generate the email on your server or use JavaScript in IE on the client side (if your site is in the trusted list) to create a message using the Outlook Object Model. An even then, you would need the image file to be locally present to be able to add to the message.

Bookmarklet target page DOM traversal. How?

How do I make a bookmarklet that places something into a field and submits the form?
I think along these lines:
1)var p = document.open(http://site.com/form.htm)
2) var h = p.innerHTML
3) var f = h.getElementById('formfield')
now how do I get the URL of the current page to become the value for 'formfield'?

var p = document.open(http://site.com/form.htm)
This won't work. You may be thinking of window.open. If you use window.open, it will only be useful for your purposes if the bookmarklet is run from the same domain. If run from any other domain, it will open the window, but you won't be able to do anything else with the document in that newly opened window.
var h = p.innerHTML
This does nothing helpful in your case. It just returns a string of text.
var f = h.getElementById('formfield')
This is not correct because it uses "h", which isn't correct. What you probably want is this...
var w = window.open('http://site.com/form.htm');
// need code that will check if window is done loading before you use next line!
w.document.getElementById('formfield').value = window.location;
If you use the bookmarklet on the page with the form, you only need this:
document.getElementById('formfield').value = window.location;
If you want to open the window to another domain, enter a form value, and submit the form - This can not be done with a bookmarklet. A bookmarklet faces the same restrictions as any other javascript in a page. This is for security to prevent any web page on the internet from trying to take control of your browser and do things on other sites as you. Your only reasonable option in this case would be to create/use a browser addon/extension.

If you are looking to put the current page's URL into formfield, this is how it could be accomplished:
f.value = window.location;

If I understand correctly, you want to submit the current URL and maybe some other data to your server using a bookmarklet.
I would do it this way:
Append your form to the current DOM using JavaScript. The form should be hardcoded in the bookmarklet.
Populate the form, you are on the guest page now, same domain.
Submit the form, maybe using a target="_blank" for the result.
You can't use Ajax instead of a form to submit your data because of crossdomain restrictions.