محدد jQuery حيث النص = بعض القيمة

Question

لدي كائن (في هذه الحالة كائن تصنيف من js-kit) أريد جعله غير مرئي إذا كانت قيمة التصنيف "غير مصنفة".أواجه مشكلة في الحصول على محدد jQuery المناسب للقيام بذلك.

على الرغم من أن الكود أدناه يبدو وكأنه يجب أن يعمل، إلا أنه لا يعمل.

$(".js-rating-labelText:contains('unrated')").css("visibility", "hidden");  

.js-rating-labelText هي فئة تم تعيينها على النص.

Answer 1

<اقتباس فقرة>   

هل هناك طريقة أخرى لتحديد عنصر استنادا إلى محتويات النص؟

وجرب هذا:

$('.js-rating-labelText').filter(function(){
  return (/unrated/i).test($(this).text())
}).css('visibility', 'hidden');

Answer 2

ويمكنك إنشاء طرق محدد الخاصة

وعلى سبيل المثال، إذا كنت تريد أن تكون قادرة على القيام بما يلي:

$('.js-rating-label:hasText(unrated)');

ويمكنك تحديد طريقة hasText على النحو التالي

$.expr[':']['hasText'] = function(node, index, props){
  return node.innerText.contains(props[3]);
}

وprops[3] يحتوي على النص داخل الأقواس بعد ': hasText ".

Answer 3

ولعل القضايا هي مع الجزء :contains('Unrated') وظيفة. كما تغيير النص إلى أي قيمة عشوائية تنتج نفس النتيجة:

$("#ratingDiv:contains('somerandomtext')").hide();

Answer 4

ومتغير طفيف على @ tgmdbm في إجابة ممتازة. الفرق الوحيد هو أنه يختار فقط العقد التي لديها عقدة النص الطفل واحدة مطابقة تماما للحجة hasText(). في حين .innerText إرجاع سلسلة من كافة العقد نص أصل أفريقي.

  if( ! $.expr[':']['hasText'] ) {
     $.expr[':']['hasText'] = function( node, index, props ) {
       var retVal = false;
       // Verify single text child node with matching text
       if( node.nodeType == 1 && node.childNodes.length == 1 ) {
         var childNode = node.childNodes[0];
         retVal = childNode.nodeType == 3 && childNode.nodeValue === props[3];
       }
       return retVal;
     };
  }

Answer 5

تأكد من التعليمات البرمجية تشغيل <م> بعد وظيفة شبيبة عدة تمت تعبئة النص، وليس قبل ذلك.

Answer 6

استنادًا إلى HTML الذي قدمته، لا أرى مصدر النص "غير المصنف" الذي تختبره.

ومع ذلك، إذا كان هذا هو مجملها للنص الموجود في div، ما عليك سوى اختباره مباشرةً.

if ($('.js-rating-labelText').text() == 'unrated'){
  $(this).hide();
}

Answer 7

هل يمكن النظر في استخدام إخفاء () / العرض () أساليب كذلك.

$(".js-rating-labelText:contains('unrated')").hide()

Answer 8

أفضل طريقة لشرح الموضوع هي بإعطاء مثال ورابط مرجعي:-

مثال:-يحدد بناء جملة محدد jQuery التالي العنصر الأول أو العنصر التاسع من مجموعة عناصر HTML المحددة (المتطابقة) بالفعل.

$("selector:contains(searchText)")

لغة البرمجة:-

<table>
<tr><td>John Smith</td><td>Marketing</td></tr>
<tr><td>Jane Smith</td><td>Sales</td></tr>
<tr><td>Mike Jordon</td><td>Technology</td></tr>
<tr><td>Mary Jones</td><td>Customer Support</td></tr>
</table>
Search: <input id="txtSearch" type="text">
<input id="btnTestIt" type="button" value="Test It">
<input id="btnReset" type="reset" value="Reset">

مسج:-

$(document).ready( function(){
    $("#btnTestIt").click( function(){
        var searchText = $("#txtSearch").val();
        $("td:contains('" + searchText + "')").css("background-color", "yellow");
    });
    $("#btnReset").click( function(){
        $("td").css("background-color", "white");
    });
});

Answer 9

وهنا بعض من أتش تي أم أل القادمة من وظيفة جافا سكريبت:

<div class="js-kit-rating" id="ratingDiv" style="width: 86px; visibility: hidden;" jk$initialized="true" path="/business/blogger-com" permalink="/businessblogger-com" freeze="yes" starcolor="Golden">
  <table class="js-ratings-tableWrapper" border="0" cellSpacing="0" cellPadding="0">
    <tbody>
      <tr>
        <td>
          <div class="js-ratingWrapper" style="width: 80px;">
          <div style="float: left; cssfloat: left;">
              <div style="width: 80px; height: 15px;">
<div class=" js-kit-objIcon" style="width: 16px; float: left; height: 15px; cssfloat: left;" imageURL="//js-kit.com/images/stars/golden.png">
  <img style="display: none;" src="//js-kit.com/images/stars/golden.png" complete="complete"/>
<div class=" js-kit-objIcon" style="width: 16px; float: left; height: 15px; cssfloat: left;" imageURL="//js-kit.com/images/stars/golden.png"/>
<div class=" js-kit-objIcon" style="width: 16px; float: left; height: 15px; cssfloat: left;" imageURL="//js-kit.com/images/stars/golden.png"/>
<div class=" js-kit-objIcon" style="width: 16px; float: left; height: 15px; cssfloat: left;" imageURL="//js-kit.com/images/stars/gray.png">
  <img style="display: none;" src="//js-kit.com/images/stars/gray.png" complete="complete"/>
<div class=" js-kit-objIcon" style="width: 16px; float: left; height: 15px; cssfloat: left;" imageURL="//js-kit.com/images/stars/gray.png"/>
<div class=" js-rating-labelText">