向表中的某些单元格添加删除线功能 [英] Adding strike-through feature to certain cells in Table

查看:83
本文介绍了向表中的某些单元格添加删除线功能的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个函数,可以根据用户在文本框中输入的数字来创建一定数量的单元格.我试图获取它,以便在单击阴影均匀行"按钮时,每个其他单元格都可以通过,但没有运气.我觉得使用i%2 === 0是获取要插入行的单元格的正确方法,但是不确定要放入的特定参数.任何建议都将有所帮助!

I have a function that creates a certain number of cells based on the number a user enters into a text box. I am trying to get it so that when the "Shade even Rows" button is clicked, every other cell gets a line-through, but am not having luck. I feel like using i % 2 === 0 is the right way to get the cells I want to put a line-through, but not sure of the specific parameters to put in. Any suggestions would help!

$(document).ready(function() {
  $('#nbrTxt').focus();

  function addItem() {

    var value = $('#nbrTxt').val();
    var usrName = prompt("Name?");
    $('#buttons').append('<li><button class="shade">Shade Even Rows</button><button class="drkLine">Show Dark Line Every 10 Rows</button></li>')

    for (var i = 1; i <= value; i++) {
      $('table').append('<tr><td></td><td></td></tr>');
      $('table tr:last td:first').html(i);
      $('table tr:last td:last').html(usrName);
      $(this).focus().select();
      $('#nbrTxt').val("");
    };
  };
  $('#btnGo').click(addItem);

  $('#nbrTxt').keydown(function(e) {
    if (e.which === 13)
      addItem();
  })

  $(document).on('click', '.shade', function() {
    if (('#nbrTxt').val() % 2 === 0) {
      $(this).closest("tr").css('textDecoration' === 'iine-through');
    }
  })

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>

<head>

  <title>JQuery Selector</title>

  <style type="text/css">
    body {
      font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    }
  </style>

  <script src="jquery-1.11.3.min.js"></script>
  <script src="jqueryselector.js"></script>

</head>

<body>

  <h1>JQuery Selector</h1>
  Enter Number:
  <input type="number" name="nbrTxt" id="nbrTxt" />
  <input type="button" value="GO" id="btnGo" />

  <div id='buttons'>

  </div>

  <table id="table" width="500" border="1">
    <tr>
      <td>No. Count</td>
      <td>Name</td>
    </tr>
  </table>

</body>

</html>

推荐答案

.css('textDecoration' === 'iine-through');无效,无法设置元素的css属性;参见 .css() .

.css('textDecoration' === 'iine-through'); is not valid procedure to set css property of element; see .css() .

尝试使用:even选择器

$("tr:even").css("textDecoration", "line-through")

这篇关于向表中的某些单元格添加删除线功能的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆