Question

我正在尝试用JavaScript编写一个简单的脚本，仅用于测试目的。我正在定义2个变量，有点不必要，但不管怎样，它们保存两个不同场景的字符串值，如果按钮前面的元素在单击按钮时包含粗体文本，则相应的变量将显示在警告对话框中。 / p>

所以，这是我的代码：

$(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”伪变量之前的元素吗？我想我可能会混淆这个目的，抱歉。

无论如何，我真的只需要一种方法来检查按钮前面的元素是否包含粗体文本，然后我可以完成其余的工作。：）

谢谢！

最终代码：

$(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);
    }
});

});

Answer 1

“之前的元素”可以使用.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')同时执行这两项操作。

Answer 2

您可以使用.prev() jquery函数。

Answer 3

如果使用<b>标记使文字变为粗体，则可以使用.is()方法与前一个元素上的:has()选择器一起检查它是否有任何后代{{1标签。

像这样：

<b>

如果$("input.BoldButton").click(function(){ if ($(this).prev().is(':has(b,strong)')) { // do something } else { // do something else } });与提供的选择器匹配，则返回一个布尔值。 .is()选择器确定是否有提供选择器的后代。

编辑：根据评论中的要求，更新后还要检查:has()代码。

Answer 4

$("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/

替代“this”变量

4 个答案: