Daniel Rikowski
Daniel Rikowski

Reputation: 72544

How to check browser support for HTML5 form attributes?

How can I check if a browser supports the formtarget or the form attribute?

Modernizr is no help here and I couldn't even find something on the web on the current state of form support in browsers. Although a quick test revealed all current browsers except IE 9 do support them.

So how can I check if a browser handles the form* attributes?

Upvotes: 2

Views: 1619

Answers (4)

Sev
Sev

Reputation: 2002

The form attribute on input is a special case. It was used before the HTML5 feature, to reference the parent form, but now it's used as an attribute as well, so you will have false positives on IE.

There is a checking function but it involves interaction with DOM which will probably affect performance, but here you go anyway. Hope it helps.

function testInputFormSupport() {
    var input = document.createElement('input'),
         form = document.createElement('form'),
         formId = 'test-input-form-reference-support';
    // Id of the remote form
    form.id = formId;
    // Add form and input to DOM
    document.body.appendChild(form);
    document.body.appendChild(input);
    // Add reference of form to input
    input.setAttribute('form', formId);
    // Check if reference exists
    var res = !(input.form == null);
    // Remove elements
    document.body.removeChild(form);
    document.body.removeChild(input);
    return res;
}

Upvotes: 1

Derek 朕會功夫
Derek 朕會功夫

Reputation: 94379

Here you go:

if("formtarget" in document.createElement("input")){
    //good job, browser
}else{
    //nope
}

Upvotes: 2

Andreas
Andreas

Reputation: 21911

Have a look at this site. It covers all the new form features and gives a handy little function to test the support of an attribute

// Function to test for attribute support
function elSupportsAttr(el, attr) {
  return attr in document.createElement(el);
}

Upvotes: 1

Niall
Niall

Reputation: 435

Try

if ("attribute" in document.createElement("tag"))

from How can I tell of a HTML attribute exists or not, using Javascript

Upvotes: 0

Related Questions