Skip to content Skip to sidebar Skip to footer

Click On Button/submit When It Appears On Page

I have a page where a button or a submit form will appear at an unknown time. I don´t know the id, class or xpath of the button/form but i know what the text of the button will be

Solution 1:

var interval = setInterval(function () {
    if (document.querySelectorAll("input[value='Click me']").length > 0) {
        document.querySelectorAll("input[value='Click me']")[0].click();
        clearInterval(interval);
    }
}, 100);

Hope this helps..

Solution 2:

You marked this jQuery - it could be as simple as

// The code you needvar tId;
$(function() {
    tId=setInterval(function() {
      var $but=$("[value='Click me']");
      if ($but.length>0) {
        console.log("found");
        clearInterval(tId);
        $but.click();
      }  
    },100)
});


//------------------------------------------------// other code that inserts and shows it's clicked
$(function() {
  $("#container").on("click","[value='Click me']",function() {
    console.log("clicked");
  });

  setTimeout(function() {
    $("#form1").append('<input type="button" value="Click me">');
    },3000);
});    
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="container"><divid="div1">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint</div><formid="form1"></form><div> occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita</div></div>

Solution 3:

You can select button with attr/value selector

$('input[type="button"][value="Click  here"]').on('click',function(){
//code
});

Solution 4:

As the form/button will appear at an unknown time, You can use MutationObserver and listen DOM changes.

Here in snippet I have used setTimeout to simulate button added dynamically.

varMutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;

var element = document.querySelector('#target');
setTimeout(function() {
  $(element).append('<button>Click here</button>');
}, 3000)

var observer = newMutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if (mutation.type == "childList") {
      console.log('Button found do the needful');
      //$(":button:contains('Click here')").get(0).click();
    }
  });
});

observer.observe(element, {
  childList: true//configure it to listen to attribute changes
});
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="target"></div>

Solution 5:

Maybe it will help:

$('input[value="ClickMe"]').click();
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputtype="submit"value="ClickMe"onclick="alert('clicked');" />

Post a Comment for "Click On Button/submit When It Appears On Page"