第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

為什么我的變量表數(shù)據(jù)返回未定義?

為什么我的變量表數(shù)據(jù)返回未定義?

不負(fù)相思意 2024-01-18 16:27:35
我在代碼中嘗試執(zhí)行的操作是在單擊表時(shí)返回表的一行。我在 jquery 函數(shù)中執(zhí)行此操作$("tr.table").click(function)....。之后,我嘗試將此表行的數(shù)據(jù)存儲(chǔ)在名為 tableData 的變量中。這一切都工作正常,但是當(dāng)我嘗試在 if 語句中使用變量 tabledata 時(shí)。我收到一個(gè)表數(shù)據(jù)未定義的錯(cuò)誤。我的問題是如何在 if 語句中使用變量 tabledata 而不會(huì)出現(xiàn)錯(cuò)誤。我的 JavaScript 代碼function onUpdate() {    var tableData    var auth2 = gapi.auth2.getAuthInstance();    var profile = auth2.currentUser.get().getBasicProfile();    $("tr.table").click(function () {        tableData = $(this).children("td").map(function () {            return $(this).text();        }).get();    });    if( tableData[7] === 2) {        console.log("if statement");        ...    }    else {        console.log("else statement");        $.confirm({            title: '',            content: '',            buttons: {                confirm: function () {                }            }        });    }}我的html表格代碼<table class="table table-bordered table-responsive-sm table-hover">    <thead>        <tr>            <th>Date</th>            <th>TimeSlot</th>            <th>Room</th>            <th>Attendees</th>            <th>update</th>            <th>delete</th>        </tr>    </thead>         <tbody>            <tr class="table">                <td class="table">...</td>                <td class="table">...</td>                <td class="table">...</td>                <td class="table">...</td>                <td class="table" style="display: none">...</td>                <td class="table" style="display: none">...</td>                <td class="table" style="display: none">...</td>                <td class="table" style="display: none">...</td>                <td class="table command">                    <a onclick="onUpdate()" style="color: #007bff; cursor: pointer"> <i class="fa fa-pencil-square-o" aria-hidden="true"></i></a>                </td>
查看完整描述

4 回答

?
慕容708150

TA貢獻(xiàn)1831條經(jīng)驗(yàn) 獲得超4個(gè)贊

您不需要在onUpdate函數(shù)內(nèi)分配點(diǎn)擊事件。如果我理解正確,您想要單擊更新按鈕并執(zhí)行if..else塊。a您可以像 HTML 一樣傳遞元素的引用onclick="onUpdate(this)"。然后使用.closest()查找tr并將整行作為數(shù)組獲取。這里要保留的一件事是,if用于===比較可能不起作用,因?yàn)閿?shù)組甚至對于數(shù)字也將包含字符串值。因此,要么進(jìn)行類型轉(zhuǎn)換,要么僅用于==比較此處所做的值。


function onUpdate($this) {

  var tableData;


  tableData = $($this).closest('tr').children("td").map(function() {

    return $(this).text();

  }).get();


  //console.log(tableData);

  if (tableData[7] == 2) {

    console.log("if statement 2");

  } else if (tableData[7] == 22) {

    console.log("if statement 22");

  } else {

    console.log("else statement");

  }

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<table class="table table-bordered table-responsive-sm table-hover">

  <thead>

    <tr>

      <th>Date</th>

      <th>TimeSlot</th>

      <th>Room</th>

      <th>Attendees</th>

      <th>update</th>

      <th>delete</th>

    </tr>

  </thead>

  <tbody>

    <tr class="table">

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">value 2</td>

      <td class="table" style="display: none">...</td>

      <td class="table" style="display: none">1</td>

      <td class="table" style="display: none">3</td>

      <td class="table" style="display: none">2</td>

      <td class="table command">

        <a onclick="onUpdate(this)" style="color: #007bff; cursor: pointer"> update</a>

      </td>

      <td class="table command">

        <a onclick="onDelete()" style="color: #007bff; cursor: pointer"> delete</a>

      </td>

    </tr>

    <tr class="table">

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">value 22</td>

      <td class="table" style="display: none">...</td>

      <td class="table" style="display: none">1</td>

      <td class="table" style="display: none">3</td>

      <td class="table" style="display: none">22</td>

      <td class="table command">

        <a onclick="onUpdate(this)" style="color: #007bff; cursor: pointer"> update</a>

      </td>

      <td class="table command">

        <a onclick="onDelete()" style="color: #007bff; cursor: pointer"> delete</a>

      </td>

    </tr>

    <tr class="table">

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">...</td>

      <td class="table">value 33</td>

      <td class="table" style="display: none">...</td>

      <td class="table" style="display: none">1</td>

      <td class="table" style="display: none">3</td>

      <td class="table" style="display: none">33</td>

      <td class="table command">

        <a onclick="onUpdate(this)" style="color: #007bff; cursor: pointer"> update</a>

      </td>

      <td class="table command">

        <a onclick="onDelete()" style="color: #007bff; cursor: pointer"> delete</a>

      </td>

    </tr>

  </tbody>

</table>


查看完整回答
反對 回復(fù) 2024-01-18
?
慕標(biāo)5832272

TA貢獻(xiàn)1966條經(jīng)驗(yàn) 獲得超4個(gè)贊

thisonclick指的是該方法所屬的對象。我用 更改了您的 HTML 代碼onclick="onUpdate(this)",現(xiàn)在您可以使用函數(shù)影響該行的文本map()。


此外,您還需要更改選擇器以選擇<td>單擊的內(nèi)容<tr>,因此我使用了[parent().parent()][1]方法來實(shí)現(xiàn)這一點(diǎn)。您可以使用替代選擇器,例如[closest()][1]


var tableData;



function onUpdate(e) {

  tableData = $(e).parent().parent().children("td").map(function () {

        return $(this).text();

    }).get();

    

  console.log("Table data has created as; "+tableData);

  if( tableData[7] === 2) {

    console.log("if statement");

  }

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table class="table table-bordered table-responsive-sm table-hover">

    <thead>

        <tr>

            <th>Date</th>

            <th>TimeSlot</th>

            <th>Room</th>

            <th>Attendees</th>

            <th>update</th>

            <th>delete</th>

        </tr>

    </thead>

         <tbody>

            <tr class="table">

                <td class="table">...</td>

                <td class="table">...</td>

                <td class="table">...</td>

                <td class="table">...</td>

                <td class="table" style="display: none">...</td>

                <td class="table" style="display: none">...</td>

                <td class="table" style="display: none">...</td>

                <td class="table" style="display: none">...</td>

                <td class="table command">

                    <a onclick="onUpdate(this)" style="color: #007bff; cursor: pointer"> update</a>

                </td>

                <td class="table command">

                    <a onclick="onDelete(this)" style="color: #007bff; cursor: pointer"> delete</a>

                </td>

            </tr>

        </tbody>

</table>


查看完整回答
反對 回復(fù) 2024-01-18
?
慕仙森

TA貢獻(xiàn)1827條經(jīng)驗(yàn) 獲得超8個(gè)贊

將引用傳遞this給內(nèi)聯(lián)函數(shù):


<a onclick="onUpdate(this)" />

然后在處理程序中使用錨引用 ieref來獲取行:


function onUpdate(ref) {

  const $row = $(ref).closest('tr');

}

完整示例

function onUpdate(ref) {

  const $row = $(ref).closest('tr'),

    rowData = $row.find('td:not(.actions)').map(function(td) {

      return $(this).text();

    }).get();

  console.log(`Row data: ${JSON.stringify(rowData)}`);

  if (rowData[0] === '2020-12-23') {

    console.log('Hello World!');

  }

}


function onDelete(ref) {

  $(ref).closest('tr').remove();

}

thead tr th {

  text-align: center;

}


.actions {

  display: grid;

  grid-auto-flow: column;

  column-gap: 1em;

  justify-content: center;

  align-content: space-evenly;

}


.hidden {

  display: none;

}

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" rel="stylesheet"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<table class="table table-bordered table-responsive-sm table-hover">

  <thead>

    <tr>

      <th>Date</th>

      <th>Time Slot</th>

      <th>Room</th>

      <th>Attendees</th>

      <th class="hidden">Hidden #1</th>

      <th class="hidden">Hidden #2</th>

      <th class="hidden">Hidden #3</th>

      <th>Actions</th>

    </tr>

  </thead>

  <tbody>

    <tr>

      <td>2020-12-23</td>

      <td>12:00</td>

      <td>42</td>

      <td>8</td>

      <td class="hidden">...</td>

      <td class="hidden">...</td>

      <td class="hidden">...</td>

      <td class="actions">

        <a onclick="onUpdate(this)" style="color: #007bff; cursor: pointer">

          <i class="fas fa-pencil-alt" aria-hidden="true"></i>

        </a>

        <a onclick="onDelete(this)" style="color: #007bff; cursor: pointer">

          <i class="fas fa-trash" aria-hidden="true"></i>

        </a>

      </td>

    </tr>

  </tbody>

</table>


查看完整回答
反對 回復(fù) 2024-01-18
?
胡說叔叔

TA貢獻(xiàn)1804條經(jīng)驗(yàn) 獲得超8個(gè)贊

您不需要該單擊功能,因此您可以通過這種方式修改您的代碼。


<script>

    function onUpdate() {


      var tableData = $("tr.table")

        .children("td")

        .map(function () {

          return $(this).text();

        })

        .get();


      if( tableData[7] === 2) {

         console.log("if statement");

      }

    }

  </script>


查看完整回答
反對 回復(fù) 2024-01-18
  • 4 回答
  • 0 關(guān)注
  • 254 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號