2015-11-04 100 views
0

我有两个按钮:查询和导出。导出按钮在默认情况下是禁用的,但是当查询按钮被单击并且表单已经加载时,我希望启用导出按钮。单击另一个按钮并提交表单后启用按钮

现在,当我点击查询导出启用了一秒,然后又回到被禁用。我假设在提交表单时它有一些事情要做,并将导出按钮恢复为原始状态。

<button type="submit" class="btn btn-primary btn-small" id="query">Query</button> 
<button class="btn btn-primary btn-small" id="export-button" disabled="disabled">Export</button> 

这是我的jQuery目前的样子。

$(".form").on("submit", function() { 
    $('#export-button').prop('disabled', false); 
}) 
+0

_“我认为当表单提交时它有一些事情要做,它将导出按钮恢复为原始状态。”_正确。除非您拦截提交事件,否则页面将加载新页面(或同一页面),并且更改将丢失。 – j08691

+0

@ j08691有没有办法以某种方式存储更改,以便在页面重新加载之后,它将启用按钮? – mCat

+0

你需要存储它在某个地方被点击的事实,比如在一个cookie,session,URL,localStorage,数据库等等。 – j08691

回答

-1

jQuery的1.6+ https://api.jquery.com/removeProp/
的jQuery 1.5 https://api.jquery.com/removeAttr/

如果你有jQuery的1.6+,尝试

$('#export-button').removeProp('disabled'); 

如果你有的jQuery 1.5或下面试着ü SE:

$('#export-button').removeAttr('disabled'); 

,并确保在窗体中有.form

+0

OP的jQuery工作正常。只是该页面正在重新加载,并且该按钮又回到被禁用状态。 – j08691

+0

感谢您的快速回复!无论如何,我试过,我仍然得到相同的结果 - 导出按钮启用一秒,然后再次禁用。 – mCat

-1

可以实现这种方式。假设你正在使用默认的get方法的表单标签。

<form> 
    <button type="submit" name="submit" class="btn btn-primary btn-small" id="query">Query</button> 
    <?php 
    if(empty($_GET)) 
     $str = 'disabled="disabled"'; 
    else 
     $str =""; 
    ?> 
    <button class="btn btn-primary btn-small" id="export-button" <?php echo $str; ?>>Export</button> 
    </form> 
+1

我不允许为此使用php。我需要保持它与其他代码一致。 – mCat

0

我知道我张贴这一段时间回来,但如果有人在这儿也有类似的问题,我就是这样做来解决这个问题:

首先,我建立了我的表单内隐藏输入要记住按钮是否已经被点击或不

<input type="hidden" name="clicked" value="true" /> 

在这个函数,它要么在会话存储检查按钮被点击或将其保存到会话存储。

$(function() { 
    $(document).ready(function() { 
    var clicked = sessionStorage.getItem('clicked'); 
     if (clicked == 'true') { 
      $('#exportButton').removeAttr('disabled'); 
     } else { 
      $('#exportButton').attr('disabled', 'disabled'); 
     } 
    }); 
    $('#query').on("click", function() { 
     sessionStorage.setItem('clicked', 'true'); 
    }); 
    $('#reset').on("click", function() { 
     sessionStorage.setItem('clicked', 'false'); 
    }); 
});