Question

function insertQuestion(form) {   

var x = "<img src='Images/plussigndisabled.jpg' width='30' height='30' alt='Look Up Previous Question' class='plusimage' name='plusbuttonrow'/><span id='plussignmsg'>(Click Plus Sign to look <br/> up Previous Questions)</span>" ;

    if (qnum == <?php echo (int)$_SESSION['textQuestion']; ?>) {

   $('#mainPlusbutton').html(x); // no need to create a jQuery object

}

//append rows into a table code, not needed for this question

}

<form id="QandA" action="<?php echo htmlentities($action); ?>" method="post">

<table id="question">

<tr>
<td colspan="2">
<a onclick="return plusbutton();">
<img src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage" id="mainPlusbutton" name="plusbuttonrow"/>
</a>
<span id="plussignmsg">(Click Plus Sign to look up Previous Questions)</span>
</td>
</tr>
</table>

<table id="questionBtn" align="center">
<tr>
<th>
<input id="addQuestionBtn" name="addQuestion" type="button" value="Add Question" onClick="insertQuestion(this.form)" />
</th>
</tr>
</table>

</form>

上述代码的假设是用户点击“添加问题”按钮，这会将问题编号附加到表格中。现在假设发生的是，如果在jquery函数中满足if语句，那么它假设用Images/plussign.jpg替换加号按钮图像Images/plussigndisabled.jpg。但它没有这样做。

所以我的问题是用另一个图像按钮替换图像按钮的最佳方法是什么？同样在文档就绪功能中，我需要它返回显示Images/plussign.jpg按钮。

Answer 1

那段代码让我头疼不已。

您的代码

$('#mainPlusbutton').html(x);

指的是图像标签。您对html的调用应该替换标记中的，但图像标记不能包含任何内容，因此无需替换。

Answer 2

如果要用新的html替换整个按钮

，可以使用replaceWith()方法

$('#mainPlusbutton').replaceWith(x);

API参考：http://api.jquery.com/replaceWith/

我怀疑你真的只想替换按钮的src，并同时禁用它，这可以通过attr()和prop()方法来完成

var newImage='Images/plussigndisabled.jpg';

$('#mainPlusbutton').attr('src',newImage).prop('disabled',true);

请注意，ID在页面中必须是唯一的，因此如果要复制行，则需要修改为使用类并修改遍历以更改相应的元素

Answer 3

我建议使用span或div来包含此图片标记。

<img src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage" id="mainPlusbutton" name="plusbuttonrow"/>

并用此更改脚本。

$('#mainPlusbutton').parent().html(x);

如何用普通图像替换图像按钮

3 个答案: