无法禁用两个提交按钮中的一个,反之亦然

时间:2015-01-16 13:43:50

标签: javascript jquery

我有一个这种模式的表单

<form action="domains.php#searchdomain" method="post" name="m_domain">
      <a name="searchdomain"></a>
        <table class="dataTable" width="100%" border="0" cellspacing="0" cellpadding="5" id="" style="text-align:center; margin-top:0px; border-left:1px solid #ddd; border-right:1px solid #ddd; border-top:1px solid #ddd;">
          <tr>
            <td align="left" colspan="2"><div id="display_message" <?php echo $sstyle; ?>><?php echo $dis_msg; ?></div></td>
          </tr>
          <tr>
            <td align="left">Search Domain</td>
            <td align="left" style="display:none;" id="apply_text">Replace Selected Domains With</td>
          </tr>

          <tr>
            <td align="center"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td><input class="input_field" name="search_domain" id="search_domain" value="<?php echo $search_domain; ?>" type="text"></td>
                  <td>&nbsp;</td>
                  <td><input type="submit" class="btn blue_button" 
                    name="submit_domain_form" id="submit_search_button"
                  value="Search" onclick="return searchValidate();"></td>
                </tr>
              </table></td>
            <td align="center"><table width="100%" border="0" cellspacing="0" cellpadding="0" id="apply_button" style="display:none;">
                <tr>
                  <td><input class="input_field" name="domain_name_url" id="domain_name_url" value="<?php echo $domain_name_url; ?>" type="text"></td>
                  <td>&nbsp;
                  <input name="domain_replace_id" id="domain_replace_id" 
                  value="" type="hidden">
                  <input name="domain_replace_link" id="domain_replace_link" 
                  value="" type="hidden">
                  </td>
                  <td><input type="submit" class="btn blue_button" 
                    name="submit_domain_form" id="submit_replace_button"
                  value="Apply" onclick="return validate();"></td>
                </tr>
              </table></td>
          </tr>
          <tr>
            <td align="center">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td><input type="checkbox" name="status_domain" id="status_domain" <?php if($status_domain){?> checked <?php } ?>>&nbsp;Include inactive campaigns in search.</td>
                      <td>&nbsp;</td>
                      <td>&nbsp;</td>
                    </tr>
                </table>
            </td>
            <td align="center">&nbsp;</td>
          </tr>

        </table>
        <?php
        echo '<div style="border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd;  width:100%; padding:10px;">';
        if(sizeof($request_list) > 0)
        {
        echo ' 
        <div class="pg_wrapper">
        <div class="progress" style="width:80%;float: left;position: relative; top: 0; z-index: 999; display: none;"><div class="progress-bar" role="progressbar" aria-valuenow="60"   aria-valuemin="0" aria-valuemax="100" ></div></div><div id="cancel_load" style="float: left; height: 23px; font-size: 12px; vertical-align:middle; padding-left: 5px; display: none;"><a style="color:#428bca;" href="javascript:void(0);" ><strong>Cancel</strong></a>
        </div>
        <div class="clearfix"></div>
        </div>
        ';
        }
        echo '</div>';
        ?>
        <div id="lp_pages_table" style="padding: 10px; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;">
            <table class="display compact" width="100%" border="0" cellspacing="0" cellpadding="5" id="domains_list" style="margin-top:0px; border:1px solid #ddd;">
                <thead>
                    <tr>
                    <th style="text-align:center;"><input type="checkbox" name="chk_all" class="checkall" id="checkedAll"></th>
                    <th>URL</th>
                    <th>Type</th>
                    <th>ID</th>
                    <th>Campaign</th>
                    <th>Status</th>
                    </tr>
                </thead>
            </table>

        </div>
        </form>

我想要那个,

  1. #search_domain设置焦点时,#submit_replace_button将被禁用。
  2. #domain_name_url关注它时,#submit_search_button将被禁用
  3. 为此,我有这段代码

    $(document).bind('keyup', function(e) 
    {
        if (e.keyCode === 13) 
        {
            //console.log("Replace focus :"+$('#domain_name_url').is(':focus')) 
            //console.log("Search focus :"+$('#search_domain').is(':focus'))
            if($('#domain_name_url').is(':focus')) 
            {
                console.log("Replace focus :"+$('#domain_name_url').is(':focus'))
                console.log("Search focus :"+$('#search_domain').is(':focus'))
                console.log("Inside Replace :")
                $('#submit_search_button').prop("disabled",true);
                $('#submit_replace_button').prop("disabled",false);
                $("#submit_replace_button").click();
            }
            else if($('#search_domain').is(':focus')) 
            {
                console.log("Replace focus :"+$('#domain_name_url').is(':focus'))
                console.log("Search focus :"+$('#search_domain').is(':focus'))
                console.log("Inside Search :")
                $('#submit_replace_button').prop("disabled",true);
                $('#submit_search_button').prop("disabled",false);
                $("#submit_search_button").click();
            }
            else
            {
    
            }
        }
    });
    

3 个答案:

答案 0 :(得分:1)

这样的事情?这里演示:http://jsfiddle.net/swm53ran/109/

$(document).ready(function() {
    $('#search_domain').on('focus', function() {
        $('#submit_replace_button').attr('disabled', true);
    });
    $('#search_domain').on('blur', function() {
        $('#submit_replace_button').attr('disabled', false);
    });
    $('#domain_name_url').on('focus', function() {
        $('#submit_search_button').attr('disabled', true);
    });
    $('#domain_name_url').on('blur', function() {
        $('#submit_search_button').attr('disabled', false);
    });
});

答案 1 :(得分:0)

你可以在元素本身上使用onfocus来激活一个禁用脚本的函数: W3Schools onfocus 然后使用onblur来撤消它 W3Schools onblur

这很容易使用

答案 2 :(得分:-1)

使用此代码禁用按钮: -

$('your element').attr("disabled","disabled");

使用此功能启用

$('your element').removeAttr("disabled");