jquery를 사용하여 루프의 셀 값을 얻는 방법

예에 의한 학습

동일한 행을 추가하려는 다른 셀의 값 차이를 계산하기 위해 행과 관련된 셀의 값을 얻고 싶습니다.

스 니펫은 내가 착지 한 모든 행과 해당 인스턴스에서 선택한 행의 동일한 행에서 데이터를 가져 오려는 의미를 보여줍니다. 그 외에는 코드와 관련이 없습니다.

$(document).ready(function() {
  $('tbody tr').eq(0).find('td').eq(7).css('background-color', 'green');
  $('tbody tr').eq(3).find('td').eq(7).css('background-color', 'green');
  $('tbody tr').eq(4).find('td').eq(7).css('background-color', 'green');
});
table,
td {
  border: 1px solid #000;
}
td {
  width: 40px;
  height: 40px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<body>
  <table>
    <tbody>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </tbody>
  </table>
</body>

이것은 셀에서 값을 얻는 내 jquery 코드입니다.

$(document).on('blur', '.price', function(){
        var id = $(this).data("id1");
        var price = $(this).text();
        edit_data(id, price, "price");
    });

이 문제를 해결하려고 시도했습니다.

$(document).on('blur', '.price', function(){
        var id = $(this).data("id1");
        var price = $(this).text();
        edit_data(id, price, "price");

        var id2 = $('.final_price').data("id2");
        var final_price = $('.final_price').text();

        var diff_total = final_price - price;
        edit_data(id, diff_total, "diff");

    });

위의 jquery 코드는 내가 가진 모든 셀의 모든 final_price 값의 문자열을 반환합니다.

이것은 테이블의 코드이지만 배열 인 것을 볼 수 있듯이 여러 셀을 반환하고 각 셀에는 자체 값이 있습니다.

<?php

$connect = mysqli_connect("localhost", "root", "", "test_db");  
$output = '';  
$sql = "SELECT * FROM tbl_sample ORDER BY id DESC";  
$result = mysqli_query($connect, $sql);

$output .= '
    <div class="table-responsive">
    <table class="table table-bordered">
    <tr>
    <th width="10%">Id</th>
    <th width="40%">Price</th>
    <th width="40%">Final Price</th>
    <th width="10%">Delete</th>
    </tr>';
if(mysqli_num_rows($result) > 0){
    $final_price_total = 0;
    $price_total = 0;
    while($row = mysqli_fetch_array($result)){
        $output .= '
            <tr>
            <td>'.$row["id"].'</td>
            <td class="price" data-id1="'.$row["id"].'" contenteditable>'.$row["price"].'</td>
            <td class="final_price" data-id2="'.$row["id"].'" contenteditable>'.$row["final_price"].'</td>
            <td><button type="button" name="delete_btn" data-id3="'.$row["id"].'" class="btn btn-xs btn-danger btn_delete">x</button></td>
            </tr>
            ';
            $final_price_total += $row["final_price"];
            $price_total += $row["price"];
        }
        $output .= '
            <tr>
            <td></td>
            <td class="price_total" id="price_total" name="price_total" value="'.$price_total.'" contenteditable>'.$price_total.'</td>
            <td class="final_price_total" id="final_price_total" name="final_price_total" value="'.$final_price_total.'" contenteditable>'.$final_price_total.'</td>
            <td></td>
            </tr>
            ';
        $output .= '
            <tr>
            <td></td>
            <td id="price" contenteditable></td>
            <td id="final_price" contenteditable></td>
            <td><button type="button" name="btn_add" id="btn_add" class="btn btn-xs btn-success">+</button></td>
            </tr>
            ';
}
else{
    $output .= '<tr>
    <td colspan="4">Data not Found</td>
    </tr>';
}
$output .= '</table>
</div>';
echo $output;
?>
수 피안 사오리

나는 당신이 같은 행, 즉 가격의 부모 tr 내부의 최종 가격을 읽으려고한다고 가정하고 있습니다. 다음 코드가 작동합니다.

$(document).on('blur', '.price', function(){
        var $el = $(this);
        var id = $el.data("id1");
        var price = $el.text();
        edit_data(id, price, "price");

        var $fel = $el.parents('tr:first').find('.final_price');
        var id2 = $fel.data("id2");
        var final_price = $fel.text();

        var diff_total = final_price - price;
        edit_data(id, diff_total, "diff");

    });

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

for 루프를 사용하여 객체의 값을 얻는 방법

분류에서Dev

jquery를 사용하여 TD 셀 값을 얻는 방법

분류에서Dev

jquery를 사용하여 행 및 열 위치를 사용하여 셀 값을 얻는 방법

분류에서Dev

셀레늄을 사용하여 웹 사이트의 가치를 얻는 방법

분류에서Dev

자바를 사용하여 위의 셀 값을 사용하여 모든 빈 셀을 채우는 방법

분류에서Dev

VBA를 사용하여 Excel에서 오류 셀의 기본 값을 얻는 방법

분류에서Dev

루프를 사용하여 여러 명령의 시간을 얻는 방법

분류에서Dev

jquery / js를 사용하여 픽셀 대신 'cm'로 요소의 marginTop을 얻는 방법은 무엇입니까?

분류에서Dev

jquery를 사용하여 링크를 클릭하면 동적 테이블의 셀 값을 얻는 방법은 무엇입니까?

분류에서Dev

jquery를 사용하여 json의 값을 기반으로 키를 얻는 방법

분류에서Dev

행의 인덱스를 사용하여 str.contains 함수를 사용하여 셀 값을 바꾸는 방법

분류에서Dev

post 메소드를 사용하여 foreach 루프 내부의 버튼 값을 얻는 방법

분류에서Dev

jquery를 통해 while 루프를 사용하여 입력 필드 값을 얻는 방법

분류에서Dev

목표 c를 사용하여 다른 배열의 uitableview에서 선택한 셀 값과 선택되지 않은 셀 값을 얻는 방법

분류에서Dev

jquery를 사용하여 선택 항목의 CSS 속성 값을 얻는 방법

분류에서Dev

jQuery를 사용하여 HTML 선택 요소의 특정 값을 얻는 방법

분류에서Dev

JS를 사용하여 JSON의 이전 값을 얻는 방법

분류에서Dev

Onkeyup only Javascript를 사용하여 특정 열 셀 값을 얻고 해당 값을 합산하는 방법

분류에서Dev

matlab을 사용하여 다른 엑셀 파일의 평균 값을 얻는 방법과 작성 방법

분류에서Dev

jQuery를 사용하여 Django 템플릿의 다른 셀 값을 기반으로 테이블 셀의 확인란 상태를 설정하는 방법

분류에서Dev

vba를 사용하여 Excel 시트의 셀에 여러 문자열 값을 추가하는 방법

분류에서Dev

루프를 사용하여 셀 값을 여러 셀로 복제

분류에서Dev

루프를 사용하여 셀 값을 여러 셀로 복제

분류에서Dev

JQuery를 사용하여 <p : selectOneMenu> 값을 얻는 방법

분류에서Dev

jquery를 사용하여 ul li 목록 값을 얻는 방법

분류에서Dev

jQuery를 사용하여 URL에서 XML 값을 얻는 방법

분류에서Dev

jquery를 사용하여 값 변경을 얻는 방법

분류에서Dev

Jquery를 사용하여 여러 배열을 얻고 관련 배열 키의 값을 변경하는 방법

분류에서Dev

jQuery Datatable-셀 값을 사용하여 행을 삭제하는 방법

Related 관련 기사

  1. 1

    for 루프를 사용하여 객체의 값을 얻는 방법

  2. 2

    jquery를 사용하여 TD 셀 값을 얻는 방법

  3. 3

    jquery를 사용하여 행 및 열 위치를 사용하여 셀 값을 얻는 방법

  4. 4

    셀레늄을 사용하여 웹 사이트의 가치를 얻는 방법

  5. 5

    자바를 사용하여 위의 셀 값을 사용하여 모든 빈 셀을 채우는 방법

  6. 6

    VBA를 사용하여 Excel에서 오류 셀의 기본 값을 얻는 방법

  7. 7

    루프를 사용하여 여러 명령의 시간을 얻는 방법

  8. 8

    jquery / js를 사용하여 픽셀 대신 'cm'로 요소의 marginTop을 얻는 방법은 무엇입니까?

  9. 9

    jquery를 사용하여 링크를 클릭하면 동적 테이블의 셀 값을 얻는 방법은 무엇입니까?

  10. 10

    jquery를 사용하여 json의 값을 기반으로 키를 얻는 방법

  11. 11

    행의 인덱스를 사용하여 str.contains 함수를 사용하여 셀 값을 바꾸는 방법

  12. 12

    post 메소드를 사용하여 foreach 루프 내부의 버튼 값을 얻는 방법

  13. 13

    jquery를 통해 while 루프를 사용하여 입력 필드 값을 얻는 방법

  14. 14

    목표 c를 사용하여 다른 배열의 uitableview에서 선택한 셀 값과 선택되지 않은 셀 값을 얻는 방법

  15. 15

    jquery를 사용하여 선택 항목의 CSS 속성 값을 얻는 방법

  16. 16

    jQuery를 사용하여 HTML 선택 요소의 특정 값을 얻는 방법

  17. 17

    JS를 사용하여 JSON의 이전 값을 얻는 방법

  18. 18

    Onkeyup only Javascript를 사용하여 특정 열 셀 값을 얻고 해당 값을 합산하는 방법

  19. 19

    matlab을 사용하여 다른 엑셀 파일의 평균 값을 얻는 방법과 작성 방법

  20. 20

    jQuery를 사용하여 Django 템플릿의 다른 셀 값을 기반으로 테이블 셀의 확인란 상태를 설정하는 방법

  21. 21

    vba를 사용하여 Excel 시트의 셀에 여러 문자열 값을 추가하는 방법

  22. 22

    루프를 사용하여 셀 값을 여러 셀로 복제

  23. 23

    루프를 사용하여 셀 값을 여러 셀로 복제

  24. 24

    JQuery를 사용하여 <p : selectOneMenu> 값을 얻는 방법

  25. 25

    jquery를 사용하여 ul li 목록 값을 얻는 방법

  26. 26

    jQuery를 사용하여 URL에서 XML 값을 얻는 방법

  27. 27

    jquery를 사용하여 값 변경을 얻는 방법

  28. 28

    Jquery를 사용하여 여러 배열을 얻고 관련 배열 키의 값을 변경하는 방법

  29. 29

    jQuery Datatable-셀 값을 사용하여 행을 삭제하는 방법

뜨겁다태그

보관