Question

我需要以下jQuery代码：如果表单操作是特定链接，那么我需要隐藏其中的某些元素。

<form action="/sites/page1.aspx">
    <div class="A"></div>
    <div class="B"></div>
</form>

如果表单操作是/sites/page1.aspx，那么我需要隐藏A类

<form action="/sites/page2.aspx">
    <div class="A"></div>
    <div class="B"></div>
</form>

如果表单操作是/sites/page2.aspx，那么我需要隐藏B类

提前致谢。

Answer 1

试试这个：

if ($('form').attr('action') == '/sites/page1.aspx') {
    $('form .A').hide();
} else if ($('form').attr('action') == '/sites/page2.aspx') {
    $('form .B').hide();
} else {
    // do whatever you want
}

$(document).ready(function() {
  console.log('HELLO -> ' + $('form').attr('action'));
  if ($('form').attr('action') == '/sites/page1.aspx') {
      $('form .A').hide();
  } else if ($('form').attr('action') == '/sites/page2.aspx') {
      $('form .B').hide();
  } else {
      // do whatever you want
  } 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div>

  <form action="/sites/page1.aspx">
      <div class="A">Hello</div>
      <div class="B">It's me</div>
  </form>

</div>

Answer 2

解决方案就像CSS规则一样简单，不需要做任何jQuery，这是一件好事，因为即使在浏览器中关闭了Javascript它也能正常工作：

form[action=\/sites\/page1.aspx] > .A, form[action=\/sites\/page2.aspx] > .B {
    display: none;
}

如果您需要动态，可以将其生成style标记，或者如果您有预定义的集合，则将其写入外部CSS。

Answer 3

为您的表单标记提供一些ID，例如id =＆＃34; myform＆＃34;并在javascript中尝试document.getElementById（＆＃34; myForm＆＃34;）。action，您将获得操作URL。您可以通过在javascript中添加条件轻松完成： - ）

使用JQuery的示例ypu可以在加载时使用：

Class

检查表单操作并隐藏元素

3 个答案: