如何使用jquery在span中找到值?

时间:2016-10-23 05:17:53

标签: php jquery html

enter image description here我需要在点击删除按钮时找到每个范围内的值。任何帮助都应该被赞赏。当我点击删除链接时,我需要返回raw.proample中的用户名,项目名和模块。例如,当我点击mysqlclient附近的删除按钮时,我需要aasttest,mysite和mysql客户端作为输出。

<html>
<head>
</head>
<body>
<?php require_once 'cms_class.php';
$dj = new DCMSI();?>
<?php
$modules = $dj->view_user_modules(); ?>
<?php if(!$modules):?>
<?php echo ""; ?>
<?php else:?>
<h3>user modules</h3>
<table border='1'>
<tr><th>module</th><th>project</th><th colspan="2">module</th></tr>
<?foreach ($modules as $key =>$value):?>
<tr class="delete-module"><td class="username"><?php echo $value['username'];?></td>
<td class="project"><?php echo $value['project'];?></td>
<td><?foreach ($value['modules'] as $key =>$value):?><span class="module"><?php echo $value['module']?></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="">delete</a></br><?php endforeach; ?></td>
<?php endforeach; ?>
<?php endif;?>
</table>
</body>
</html>

<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.toaster.js"></script>
<script src="js/bootbox/bootbox.min.js"></script>
<script>
$('.delete-module').off('click').on('click', function(e){
    e.preventDefault();
    var username = $(this).closest('tr').find('.username').html();
    var project = $(this).closest('tr').find('.project').html();
    var module = $(this).closest('tr').find('span.module').val();
});                
</script>

2 个答案:

答案 0 :(得分:1)

更改您的表并添加一个类到锚标记  我添加了课程deldata

<table border='1'>
<tr><th>module</th><th>project</th><th colspan="2">module</th></tr>
<?foreach ($modules as $key =>$value):?>
<tr class="delete-module"><td class="username"><?php echo $value['username'];?></td>
<td class="project"><?php echo $value['project'];?></td>
<td><?foreach ($value['modules'] as $key =>$value):?><span class="module"><?php echo $value['module']?></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="" class="deldata">delete</a></br><?php endforeach; ?></td>
<?php endforeach; ?>
<?php endif;?>
</table>
<script>
    $('.deldata').click(function(e){
    e.preventDefault();

    var username = $(this).closest('tr').find('.username').text();
    var project = $(this).closest('tr').find('.project').text();
    var module = $(this).prev().text();

    alert(module);
});  
</script>

答案 1 :(得分:1)

你可以这样。

&#13;
&#13;
$(document).ready(function() {

  $("table").on("click", "tr", function(event) {
    var obj = {};
    obj.raw = $(event.target).siblings("span").html().trim();

    obj.module =
      $(event.currentTarget).find(".moduleName").html().trim();

    obj.project = $(event.currentTarget).find(".projectName").html().trim();
    console.log(obj);
  });

});
&#13;
td,
th {
  border: 1px solid black;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <thead>
    <tr>
      <th>Module</th>
      <th>Project</th>
      <th>Module</th>
    </tr>

  </thead>
  <tbody>
    <tr>
      <td class="moduleName">assttest
      </td>
      <td class="projectName">myssite
      </td>
      <td>
        <div>
          <span>mysql</span>
          <a href="#">delete</a>
        </div>
        <div>
          <span>django-filter</span>
          <a href="#">delete</a>
        </div>
      </td>
    </tr>
    <tr>
      <td class="moduleName">assttest
      </td>
      <td class="projectName">newsite</td>
      <td>
        <div>
          <span>Test Module</span>
          <a href="#">delete</a>
        </div>
      </td>
    </tr>
  </tbody>
</table>
&#13;
&#13;
&#13;