Question

尝试显示和隐藏页面的各个部分。我只想显示页面中与conditionsToShow数组中的单词匹配的部分。

function hideWorkflowConditions() {

    // hide the elements initially
    $('#descriptors_table > tbody').children().css('display', 'none');

}

function showWorkflowConditions() {

    let conditionsToShow = `
    Block transition until approval
    Category is not Empty
    Code Committed
    File Uploader is User
    File Uploader is in Group
    File Uploader is in Project Role
    Has Attachments AM
    Has Links AM
    Hide transition from user
    Limit By Status
    No Open Reviews
    Only Assignee
    Only Reporter
    Permission
    SIL
    Script  [ScriptRunner]
    Sub-Task Blocking
    Unreviewed Code
    User Is In Group
    User Is In Group Custom Field
    User Is In Project Role
    Verify Number of Attachments in Category
    `;

    // create a new array, using the new line break
    let conditionsArray = conditionsToShow.split(/\n/).filter(Boolean);
    // trim the whitespace from the array
    let conditionsArrayTrimmed = conditionsArray.map(Function.prototype.call, String.prototype.trim);

    conditionsArrayTrimmed.forEach(element => {
        // will not work, doesn't give any errors in the console but the entire section stays hidden
        $( "#descriptors_table > tbody > tr (:contains('"+ element +"'))" ).css('display', 'table-row');

    });

}

hideWorkflowConditions();
showWorkflowConditions();

// running this works to show a single, previously hidden element
/*var elx = "Only Reporter";
$( "#descriptors_table > tbody > tr (:contains('"+ elx +"'))" ).css('display', 'table-row');
*/

Answer 1

选择器对于括号:contains()无效，并且tr后面有一个空格，这意味着:contains()将对行的后代进行操作，而不是对行本身。

function hideWorkflowConditions() {
  $('#descriptors_table > tbody').children().css('display', 'none');
}

function showWorkflowConditions() {
  let conditionsToShow = `
    Block transition until approval
    Category is not Empty
    Code Committed
    File Uploader is User
    File Uploader is in Group
    File Uploader is in Project Role
    Has Attachments AM
    Has Links AM
    Hide transition from user
    Limit By Status
    No Open Reviews
    Only Assignee
    Only Reporter
    Permission
    SIL
    Script  [ScriptRunner]
    Sub-Task Blocking
    Unreviewed Code
    User Is In Group
    User Is In Group Custom Field
    User Is In Project Role
    Verify Number of Attachments in Category
    `;

  // create a new array, using the new line break
  let conditionsArray = conditionsToShow.split(/\n/).filter(Boolean);
  // trim the whitespace from the array
  let conditionsArrayTrimmed = conditionsArray.map(Function.prototype.call, String.prototype.trim)
  .filter(Boolean);

  //console.log(conditionsArrayTrimmed);

  conditionsArrayTrimmed.forEach(element => {
    $("#descriptors_table > tbody > tr:contains('" + element + "')").css('display', 'table-row');

  });

}

hideWorkflowConditions();
showWorkflowConditions();

// running this works to show a single, previously hidden element
/*var elx = "Only Reporter";
$( "#descriptors_table > tbody > tr (:contains('"+ elx +"'))" ).css('display', 'table-row');
*/

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<table id=descriptors_table>
  <tbody>
    <tr>
      <td>foo Permission
    </tr>
    <tr>
      <td>bar
    </tr>
  </tbody>
</table>

此外，我添加了另一个.filter(Boolean)来照顾拆分产生的空格字符串。

尝试通过遍历数组失败在jQuery中重新显示页面中的隐藏元素

1 个答案: