Question

我遇到了头痛的情况。当我检查了选择选项 (05/30/2012 EQ) 时, 我无法单击选择按钮来提交动作, 但我应该可以点击它。问题发生在Chrome 和 I. E, 但问题与 FF 有关。我认为这是一个 Jquery 互不兼容的问题。我附加了一些代码如下:

  function $recalcSelection($checkbox) {
    $selectActionList.find("option").each(function() {
      $optionLength = $table.find("td.actioncolumn input:checked").length;
      if($optionLength <= 0) {
        $(this).attr("disabled", true);
      } else if($optionLength == 1) {
        $(this).attr("disabled", false);
      } else {
        if(
          $(this).val() == "editAppointment" ||
          $(this).val() == "copyAppointment" ||
          $(this).val() == "viewShowList" ||
          $(this).val() == "viewScheduledTimes")
        {
          $(this).attr("disabled", true);
        } else {
          $(this).attr("disabled", false);
        }
      }
    });

    if($selectActionList.find("option:selected").attr( disabled )) {
      $selectActionList.find("option:enabled").eq(0).attr("selected", true);
    }

    if($selectActionList.find("option:enabled").length <= 0) {
      $selectActionButton.attr("disabled", true);
    } else {
      $selectActionButton.attr("disabled", false);
    }
  }

$selectActionButton 是提交按钮, $selectActionButton 是选择列表。我试图打印 $selectActionList. find. find (“ 选项: 已启用 ” ) 。铬的长度为 0 。但是当我在 FF 中打印时, 是 7 。有人能帮我找出原因吗? 我非常感激。

""https://i.sstatic.net/RNKKv.png" alt="此处输入图像描述"/"

兹附上一些HTML表格如下:

<table id="appointmentTable">
  <thead>
    <tr class="headerrow">
      <th class="actioncolumn"></th>
      <th class="datecolumn">Date</th>
      <th class="earliesttimecolumn">Start Time</th>

      <th class="clientnamecolumn">Client</th>
      <th class="locationcolumn">Location</th>
      <th class="roomcolumn">Rooms</th>
      <th class="typecolumn">Type</th>
      <th class="filledtimescolumn">Filled Times</th>
    </tr>

  </thead>

  <tbody> 

      <tr class=" hiddenrow" appointmentid="15166">
        <td class="actioncolumn"><input type="checkbox" name="appointmentids[]" value="15166" /></td>
        <td class="datecolumn"><span title="1338094800"></span><a href="?action=viewDailyUsers&date=05/27/2012&clients[]=8" title="View Appointments on 05/27/2012">05/27/2012</a></td>
        <td class="earliesttimecolumn"></td>
        <td class="clientnamecolumn">CPH</td>
        <td class="locationcolumn">New Location</td>
        <td class="roomcolumn"></td>

        <td class="typecolumn">Screening</td>
        <td class="filledtimescolumn">0/0</td>
      </tr>
   </tbody>

  <tfoot>
    <tr class="actionrow">
      <td colspan="2" class="actioncolumn"></td>
      <td colspan="6">With Selected:</td>
    </tr>
    <tr class="actionrow">
                  <td colspan="2" class="actioncolumn">

        <input type="submit" name="button" value="Create New" />
      </td>
                  <td colspan="6">
        <select id="selectactionlist" name="selectaction">
                          <optgroup label="Adjustments">
            <option value="editAppointment">Edit</option>
            <option value="copyAppointment">Copy</option>
            <option value="deleteAppointment">Delete</option>

          </optgroup>
                          <optgroup label="Lists">
                              <option value="viewShowList">Show/No Show List</option>
                              <option value="viewScheduledTimes">Schedule List</option>
          </optgroup>
                          <optgroup label="Hidden">
            <option value="hideAppointment">Hide</option>

            <option value="showAppointment">Show</option>
          </optgroup>
                        </select>
        <input id="selectactionbutton" type="submit" name="button" value="Select" />
      </td>
    </tr>
  </tfoot>

Answer 1

而不是采取下列行动:

    if (foo) {
      $(this).attr("disabled", true);
    } else {
      $(this).attr("disabled", false);
    }

您应该添加并删除禁用的属性, 因为有时只有存在禁用的属性才能禁用该属性( 可能是因为铬使该属性无法禁用)。请尝试 :

if (foo) {
    $(this).attr("disabled", true);
} else {
    $(this).removeAttr("disabled");
}

< 加强> EDIT: 尝试此精确代码

function $recalcSelection($checkbox) {
    $selectActionList.find("option").each(function() {
        $optionLength = $table.find("td.actioncolumn input:checked").length;
        if($optionLength <= 0) {
            $(this).attr("disabled", true);
        } else if($optionLength == 1) {
            $(this).removeAttr("disabled");
        } else {
            if($(this).val() == "editAppointment" ||
                $(this).val() == "copyAppointment" ||
                $(this).val() == "viewShowList" ||
                $(this).val() == "viewScheduledTimes")
            {
                $(this).attr("disabled", true);
            } else {
                $(this).removeAttr("disabled");
            }
        }
    });

    if($selectActionList.find("option:selected").attr( disabled ) != "true") {
        $selectActionList.find("option").filter(function () { return $(this).attr("disabled") != null}).eq(0).attr("selected", true);
    }

    if($selectActionList.find("option").filter(function () { return $(this).attr("disabled") != null}).length <= 0) {
        $selectActionButton.attr("disabled", true);
    } else {
        $selectActionButton.removeAttr("disabled");
    }
}

友情链接