Question

I am getting multiple onclicks on radio boxes on Tablets, on desktop everithing works fine but on tablet the selectCompany is called twice, is there an issue with onclick on Tablets?

Here is the code:

<div class="formcontent" id="formContent">
    <div data-role="fieldcontain" id="companyContainer" class="ui-field-contain ui-body ui-br">
        <fieldset data-role="controlgroup" class="ui-corner-all ui-controlgroup ui-controlgroup-vertical">
            <div role="heading" class="ui-controlgroup-label">Empresa:</div>
            <div class="ui-controlgroup-controls">
                <div class="ui-radio">
                    <input type="radio" onclick="selectCompany(1)" name="company_select" id="company_select_0" value="0">
                    <label for="company_select_0" data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="radio-off" data-theme="c" class="ui-btn ui-btn-icon-left ui-corner-top ui-btn-up-c ui-radio-off"><span class="ui-btn-inner ui-corner-top"><span class="ui-btn-text">Google</span><span class="ui-icon ui-icon-shadow ui-icon-radio-off">&nbsp;</span></span>
                    </label>
                </div>
                <div class="ui-radio">
                    <input type="radio" onclick="selectCompany(2)" name="company_select" id="company_select_1" value="1">
                    <label for="company_select_1" data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="radio-off" data-theme="c" class="ui-btn ui-btn-icon-left ui-radio-off ui-btn-up-c"><span class="ui-btn-inner"><span class="ui-btn-text">Amazon</span><span class="ui-icon ui-icon-shadow ui-icon-radio-off">&nbsp;</span></span>
                    </label>
                </div>
                <div class="ui-radio">
                    <input type="radio" onclick="selectCompany(4)" name="company_select" id="company_select_2" value="2">
                    <label for="company_select_2" data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="radio-off" data-theme="c" class="ui-btn ui-btn-icon-left ui-corner-bottom ui-controlgroup-last ui-radio-on ui-btn-up-c"><span class="ui-btn-inner ui-corner-bottom ui-controlgroup-last"><span class="ui-btn-text">Apple</span><span class="ui-icon ui-icon-shadow ui-icon-radio-on">&nbsp;</span></span>
                    </label>
                </div>
            </div>
        </fieldset>
    </div>
</div>

Answer 1

What I did is unbind the variable…

$("#foodiv").bind("click", function( event ) {
  functionCalledOnce();
  $(this).unbind( event );
});

It’s clean and works well for the effect.