Chrome-Extension: Find and click on element on active tab with javascript - javascript

So I'm trying to make a chrome extension for a forum and right now I'm stuck at the necessary confirm after pressing the delete-button.
I want to press the confirm-button but as far as I understand I have to find it first - for this I have the content-script. But now I dont know how to find the right element, I just dont know how to identify the button.
This is the Code on the Webpage:
<td class="confirmButtons">
<form action="modcp.php" method="post">
<input class="formAction" type="hidden" name="" value="">
<ul>
<li class="button"><strong>Ja</strong></li>
</ul>
<ul class="buttonGroup">
<li class="first"></li>
<li class="button"><strong>Nein</strong></li><a href="javascript:void(0);" class="formAction" rel="cancel" tabindex="2">
<li class="last"></li>
</a></ul><a href="javascript:void(0);" class="formAction" rel="cancel" tabindex="2">
</a></form></td>
The Code I have in the content_script so far:
function clickJa() {
var confirmButtoon = document.getElementsByClass("form-action");
confirmButton.click();
}
clickJa();
I know this doesnt work but I dont know what do do...
Thanks for every piece of help,
greetings =)

Related

Popup Modal appear behind DIV

I'm integrating Bing Custom Search Engine to the website. The search result will appear in popup. Below is the integration code. When i add the code directly into the html the popup modal appear behind the div, then i add the below script inorder to bring the popup modal front and its works absolutely fine.
But when i add the code dynamically, mean the Bing integration code will be added by onclick and the popup appear behind the div as below pic. But this code $(".bcs-modal").appendTo("body"); nolonger working. I have tried almost everything none of them working.
Any suggestion..?
<script type="text/javascript">
jQuery(document).ready(function($){
$(".bcs-modal").appendTo("body");
});
</script>
Bing Integration Code
<script type="text/javascript" id="bcs_js_snippet" class="testclass" src="https://ui.customsearch.ai/api/ux/rendering-js?customConfig=bb24718a-xxxxx&market=en-US&version=latest&q="></script>
Onclick Function
var divtest = document.createElement("div");
divtest.setAttribute("class", "removeclass");
divtest.innerHTML = '<form class="librarysearchform-form" action="/" onSubmit="return false;" method="post" id="librarysearchform-form-bsc" accept-charset="UTF-8"> <div><div class="form-item form-type-textfield form-item-keywords"> <script type="text/javascript" id="bcs_js_snippet" class="testclass" src="https://ui.customsearch.ai/api/ux/rendering-js?customConfig=xxx-96535beb4319&market=en-US&version=latest&q="><\/script></div></div><div id="edit-options" class="form-item form-type-item"> <ul class="menu"> <li class="first leaf"><a title="Clicik here to Search in INCEIF Knowledge Portal and hit Enter"> <input id="ebshost-bsc" value="ebshost" type="checkbox" class="checkbox" checked> KMC Portal</a></li> <li class="leaf"><a title="Database Search by title or category">Databases</a></li> <li class="leaf"><a title="Journal Search by title or ISSN">Journals</a></li> <li class="leaf"><a title="Course resources lists">Course resources</a></li> <li class="leaf"><a title="Digital collections">Digital collections</a></li> <li class="last leaf"><a title="Exhibitions program">and more</a></li> </ul> </div> </div></form>';

Autoclick on a href link without scrolling with pure JS

I have a little problem there. I have accordion tabs with custom a tags. You can see the code below. I made a JS code to autoclick on different tab when the page is loaded. It works nice but it's scrolling down to the tab. I am not good in JS so I just come here to get help or advice. For me it will be better to not use "something a" but "#discussion" because there can be more tabs and I like to choose which tab will be autoclicked by the hash link not with "nth-child".
I can't use ID's on taband can't use jQuery (don't have permissions, just can use JS and adding code to body/head/footer)
Thank you! :-)
<div id="tabs-div" class="some-classes">
<ul id="tabs" class="some-classes">
<li class="ui-state-default ui-corner-top">
Description
</li>
<li class="ui-state-default ui-corner-top">
Discussion
</li>
</ul>
<div>
<script>
$link = $('#tabs li:last-child a');
$link[0].click()
</script>

jQuery doesn't get loaded

I'm new to coding, but made this site a few years ago and it stopped working a month ago. No changes were made. Please help. I tested the site by putting everything in DW and it worked. So I am not sure why on the web it wont replicate.
I did try all browsers and java is enabled. This is supposed to be a rotating picture wheel from coding jack. Like I said before it did work for the past 3 years. It stopped working a month or so ago.
I have been trying everything on my end to figure it out, but I am at a loss. Any help will be appreciated, but please understand I am not an expert. I did my research and will respond to you once I have tried everything you guide me with.
Thank you!
results on webpage
<div class="zoom-gallery" id="zoom-instance-1">
<img src="images/showcase/assets/preloader.gif" class="preloader" width="55" height="18" alt="preloader" />
<ul>
<li title="images/showcase/pastor1.jpg">
<!-- "class" options are "align-left" and "align-right", these are the text-align options -->
<!-- "title" attribute is optional. If added it will link the entire slide to the url entered -->
<ul class="align-left" title="http://codecanyon.net/user/CodingJack">
</ul>
</li>
<li title="images/showcase/child.jpg">
<ul class="align-left">
</ul>
</li>
<li title="images/showcase/prayer.jpg">
<ul class="align-left">
</ul>
<li title="images/showcase/praise.jpg">
<ul class="align-left">
</ul>
<ul class="align-left">
</ul>
</li>
</ul>
<noscript>
<div id="noscript"><img src="images/showcase/pastor1.jpg" alt="jQuery Banner Rotator" width="400" height="262" align="middle" />
</div>
</noscript>
</div>

When clicking link, link needs to be replaced with content

I have 2 div's, the first is just a link,
<div id="click1" class="grid-66 mobile-grid-100 user-photo-tag-click" style="display:block" onclick="replace()"> CLICK AND SHOW TAGS
</div>
The second is a list of photo tags,
<div id="click2" class="grid-66 mobile-grid-100 user-photo-tag" style="display:none">
<ul>
<li>RACE SHOP
</li>
<li>AAA
</li>
<li>77
</li>
</ul>
</div>
I am trying to set it up so that when the link is clicked, it disappears and the photo tags show in its place. I have started a JSFIDDLE here, https://jsfiddle.net/patricksharer/g43t1bnh/ so that my code can be viewed cleanly. My javascript function doesnt seem to be working. Can somone please take a look and tell me why? Thanks

Onclick simple JS menu. I need some advice

Hi there I am working on this simple tabbing solution for an onpage sub menu. It works with 2 options "about-bio-txt" and "about-eb-txt". When I tried to add a third option, I am having issues. I have edited the text down to a few words, but the code is exactly the same.
<ul id="switch-menu">
<li id="about-eb" class="on"><a href="#" onclick='$("#about-bio-txt").hide(); $("#about-3").hide(); $("#about-eb-txt").show(); return false;'>About Everyday Bright</a></li>
<li id="about-bio"><a href="#" onclick='$("#about-eb-txt").hide(); $("#about-3").hide(); $("#about-bio-txt").show(); return false;'>Bio</a></li>
enter code here
<li id="about-3"><a href="#" onclick='$("#about-eb-txt").hide(); $("#about-bio-txt").hide(); $("#about-3").show(); return false;'>About Three</a></li>
The content for the tabs is is just before this menu.
<div id="about-eb-txt">The Constitution</div>
<div id="about-bio-txt">Science is life</div>
<div id="about-3">I AM A TREE</div>
I was wandering if someone could tell me what I am doing wrong and if I am able to add MORE tabs if I need to.
Your menu div ID for the 3rd option and associated tab container have been given the same ID - #about-3
The below should work. Also reduced the JS required from multiple object targets for the same hide request...
<li id="about-eb" class="on"><a href="#" onclick='$("#about-bio-txt, #about-3-txt").hide(); $("#about-eb-txt").show(); return false;'>About Everyday Bright</a></li>
<li id="about-bio"><a href="#" onclick='$("#about-eb-txt, #about-3-txt").hide(); $("#about-bio-txt").show(); return false;'>Bio</a></li>
<li id="about-3"><a href="#" onclick='$("#about-eb-txt, #about-bio-txt").hide(); $("#about-3").show(); return false;'>About Three</a></li>
<div id="about-eb-txt">The Constitution</div>
<div id="about-bio-txt">Science is life</div>
<div id="about-3-txt">I AM A TREE</div>

Categories

Resources