Я пытаюсь написать простой скрипт на JavaScript, только для целей тестирования. Я определяю 2 переменные, вроде ненужные, но в любом случае это хорошо, которые содержат строковые значения для двух разных сценариев. Если элемент перед кнопкой содержит полужирный текст при нажатии кнопки, соответствующая переменная будет отображаться в диалоговом окне предупреждения.

Итак, вот мой код:

$(document).ready(function(){

  var Bold="Yes, some of this text is bold!";
  var NoBold="No, none of this text is bold.";

  $("<input class="BoldButton" type="button" value="Bold?" id="IntroButton"></input>")
  .insertAfter("#intro");

  $("<input class="BoldButton" type="button" value="Bold?" id="LatestNewsButton"></input>")
  .insertAfter("#news h2");

  $("input.BoldButton").click(function(){
    if () {
      $('').();
    } else {
        $('').();
      {
});

});

Я был в середине написания своего оператора if else, когда понял, что не знаю, как проверить, находится ли жирный шрифт в элементе над кнопкой. Я думал об использовании псевдопеременной this, но я уверен, что это неправильно, потому что не будет ли этот элемент до псевдопеременной this. Я думаю, что я могу смутить цель этого, извините за это.

В любом случае, мне действительно нужен метод проверки, чтобы увидеть, содержит ли элемент перед кнопкой полужирный текст, а затем я могу сделать все остальное. :)

Благодарность!

ОКОНЧАТЕЛЬНЫЙ КОД:

$(document).ready(function(){

  var Bold="Yes, some of this text is bold!";
  var NoBold="No, none of this text is bold.";

  $('<input class="BoldButton" type="button" value="Bold?" id="IntroButton">')
  .insertAfter("#intro");

  $('<input class="BoldButton" type="button" value="Bold?" id="LatestNewsButton">')
  .insertAfter("#news p");

 $("input.BoldButton").click(function(){
    if ($(this).prev().is(':has(b, strong)')) {
      alert(Bold);
    } else {
      alert(NoBold);
    }
});

});
1
Qcom 29 Июл 2010 в 18:36

4 ответа

Лучший ответ

Если текст выделен жирным шрифтом с помощью тегов <b>, вы можете использовать метод .is() с селектором :has() в предыдущем элементе, чтобы проверить, есть ли у него какие-либо теги-потомки <b> ,

Как это:

$("input.BoldButton").click(function(){
    if ($(this).prev().is(':has(b,strong)')) {
      // do something
    } else {
      // do something else
    }
});

.is() возвращает логическое значение, если оно соответствует предоставленному селектору. Селектор :has() определяет, есть ли потомок с предоставленным селектором.


РЕДАКТИРОВАТЬ . В соответствии с запросом в комментарии, оно обновлено и теперь включает проверку тегов <strong>.

1
user113716 29 Июл 2010 в 14:55

«Элемент перед» можно выбрать с помощью .prev(): $(this).prev()

То, что вы хотели бы сделать, может быть достигнуто с помощью

$("input.BoldButton").click(function(){
    if ($(this).prev().find('b').length) {
      // bold text in there!
    } else {
      // no bold text
    }
});

Имейте в виду, однако, что это будет только найти текст, который был ободрен, используя <b>. Некоторым редакторам WYSIWYG нравится <strong> больше, поэтому вам придется .find('strong') (или делать то и другое, используя .find('b, strong').

1
MvanGeest 29 Июл 2010 в 14:58
$("input.BoldButton").click(function(){ 
    var myprev = $(this).prev();

    if () { 
      $('').(); 
    } else { 
        $('').(); 
      { 
}); 

РЕДАКТИРОВАТЬ: мое любопытство взял верх над мной, так что я сделал следующее:

 var myprev = $(this).prev();
 var mybold = myprev.css('font-weight');
 if (mybold > 400)...

Который, по моему мнению, лучше, чем принятый ответ, так как он работает для «b», «сильный», а также для заданных значений CSS, которые имеют 400 как «нормальный», жирный, жирный и т. д. (проверено только в IE8, но, похоже, работает, было бы любопытно, если бы кто-то нашел другие браузеры, отличающиеся в результате)

Вот рабочий пример, демонстрирующий это: http://jsfiddle.net/WtBkR/2/

1
Mark Schultheiss 29 Июл 2010 в 16:01

Вы можете использовать .prev () функцию jquery.

1
Pavel Nikolov 29 Июл 2010 в 14:41