Maison > interface Web > js tutoriel > Explication détaillée de la façon dont jQuery obtient la balise td dans le tableau

Explication détaillée de la façon dont jQuery obtient la balise td dans le tableau

黄舟
Libérer: 2017-07-27 16:23:25
original
1431 Les gens l'ont consulté

Tout d'abord, permettez-moi de vous présenter les problèmes que j'ai rencontrés

1 Lorsqu'un tableau contient des balises et , cela peut être grossièrement considéré comme suit :

<p style="margin-bottom: 7px;"><tr><br/>        <td><br/>            @scene.ID        </td><br/>        <td><br/>            @scene.SceneName        </td><br/>        <td><br/>            @scene.QRUrl        </td><br/>        <td><br/>            @scene.LocalUrl        </td><br/>        <td><br/>            <!--如果有图片,展示图片,没有图片生成图片--><br/>            <!--判断localUrl(本地服务器路径)是否为空,如果为空,表示没有生成,如果不为空表示已经生成--><br/>            @if (!string.IsNullOrWhiteSpace(scene.LocalUrl))<br/>            {                <!--图片不为空,展示图片地址--><br/>                <img src="@scene.LocalUrl" style="width:200px; height:100px"/><br/>            }<br/>            else<br/>            {                <!--图片为空,生成图片--><br/>                <a sceneid="@scene.ID" href="#" onclick="build(this);">生成</a><br/>            }        </td></tr><br/></p>
Copier après la connexion

2. Il y a un événement onclick ici. Tout ce que j'ai à faire est de cliquer sur le lien "Générer" pour trouver la balise de QRUrl et la balise 🎜>Nous cliquons d'abord sur cette balise pour exécuter l'événement click dans jQuery

J'ai besoin d'obtenir la balise td. Je dois d'abord savoir dans quelle ligne elle se trouve. C'est la même chose que le positionnement. Par exemple : il y a la route n°1 de Nanjing à Pékin, et il y a la route n°1 de Nanjing à Chengdu. Vous me demandez où je suis, et je vous dis que je suis au n°1 de la route de Nanjing. Je suis sûr que je sois à Pékin ou à Chengdu, donc nous devrions Pour localiser, disons que nous sommes au n°1 de Nanjing Road, Chengdu.
function build(sender){ var jqSender = $(sender); + +} 这里把js对象通过 $()转变成了jquery对象,下面的内容放在两个“+”之间。
var sceneid = jqSender.attr(&#39;sceneid&#39;); //attr可以找到对象的属性的值,这里我们找到了sceneid这个属性的值
Copier après la connexion

Il est préférable d'utiliser eq() pour obtenir une certaine ligne ici. Si le code de la page doit être modifié, cela sera très gênant. Par exemple, si vous voulez vous rappeler où se trouve ma maison, ce que vous devez connaître, c'est la rue et le numéro de la maison. Vous savez seulement que la première maison de cette rue est ma maison. Si quelqu'un d'autre ajoute une nouvelle maison ici, ce sera le cas. pas la première maison. (L’analogie est un peu inappropriée, mais les ordinateurs sont si rigides).

Donc, nous définissons un identifiant pour ce tr et une classe pour QRUrl et LocalUrl. Le code est le suivant :

Ensuite, vous pouvez le trouver dans jQuery comme ceci : <🎜. >
    <tr sceneid="@scene.ID">
        <td>
            @scene.ID        </td>
        <td>
            @scene.SceneName        </td>
        <td class="wxurl-col">
            @scene.QRUrl        </td>
        <td class="localurl-col">
            @scene.LocalUrl        </td>
        <td>
            <!--如果有图片,展示图片,没有图片生成图片-->
            <!--判断localUrl(本地服务器路径)是否为空,如果为空,表示没有生成,如果不为空表示已经生成-->
            @if (!string.IsNullOrWhiteSpace(scene.LocalUrl))
            {                <!--图片不为空,展示图片地址-->
                <img src="@scene.LocalUrl" style="width:200px; height:100px"/>
            }
            else
            {                <!--图片为空,生成图片-->
                <a sceneid="@scene.ID" href="#" onclick="build(this);">生成</a>
            }        </td>
    </tr>
Copier après la connexion

La balise td vient d'être trouvée mais n'est pas utilisée.

<script type="text/javascript">    
function build(sender) {        
var jqSender = $(sender);        
var sceneid = jqSender.attr(&#39;sceneid&#39;);        
//找到指定行类名为wxurl-col的td标签
        $(&#39;tbody tr[sceneid=&#39; + sceneid + &#39;] td.wxurl-col&#39;)        
        //找到指定行类名为localurl-col的td标签
        $(&#39;tbody tr[sceneid=&#39; + sceneid + &#39;] td.localurl-col&#39;)        
        //找到点击事件的a标签       
        jqSender

}</script>
Copier après la connexion

La méthode est comme ceci, ajoutez des « coordonnées » à l'élément, pourquoi sont-elles respectivement l'identifiant et le nom de la classe ? Tout d'abord, il y a plusieurs lignes. La seule façon de le déterminer de manière unique est de le faire. ajoutez un identifiant. Lorsque la ligne est déterminée, la colonne peut être un identifiant. Il peut également être une classe. Il est recommandé d'utiliser une classe pour faciliter notre gestion CSS
.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal