单击javascript函数后如何获取onclick按钮的标题?

时间:2016-02-28 04:54:27

标签: javascript jquery

我在李里面找到了几个onclick按钮。我想知道如果点击它后我怎么能得到JavaScript函数中每个按钮的标题?我想设置按钮的标题等于变量。提前谢谢。

<javascript>
    function MyFunction(MyFile,MyImage){

    //here i want to get the title of onclick button which is Mango and set it equal to variable.

    }
    </javascript>

    <li><a id="123456" onclick="setCurrentID('123456');javascript:MyFunction('type=fruit&day=friday','http://somesite.com/Image1.png');">Mango</a><img src="http://www.somesite.com/123456.png"></li>
    <li><a id="123457" onclick="setCurrentID('123457');javascript:MyFunction('type=fruit&day=friday','http://somesite.com/Image2.png');">Apple</a><img src="http://www.somesite.com/123457.png"></li>

2 个答案:

答案 0 :(得分:1)

您使用onclick函数发送id,然后通过以下方式引用标签:

document.getElementById("myBtn").text;

基本上是这样的:

<a id="1" onClick="reply_click(this.id)">B1</a><br />
<a id="2" onClick="reply_click(this.id)">B2</a><br />
<a id="3" onClick="reply_click(this.id)">B3</a>

<script type="text/javascript">
var newText = 'Thank You';
function reply_click(clicked_id)
{
    alert(document.getElementById(clicked_id).text);
    document.getElementById(clicked_id).text = newText;
}
</script>

编辑:道歉,没有看到你正在使用锚点而不是按钮提问,我的错。我还添加了如何更改文本。

答案 1 :(得分:1)

  

请勿使用inline-event-binding

使用innerHTML,它将返回元素的HTML / Text内容(内部)。

$(SELECTOR).next()将获取下一个元素.. .attr()将返回元素的指定属性。

试试这个:

&#13;
&#13;
var CurrentID;
$('li a').on('click', function(e) {
  e.preventDefault();
  setCurrentID(this.id);
  MyFunction('type=fruit&day=friday', $(this).next('img').attr('src'), this.innerHTML);
});

function setCurrentID(id) {
  CurrentID = id;
}

function MyFunction(MyFile, MyImage, MyTitle) {
  alert('MyFile: ' + MyFile + '  MyImage: ' + MyImage + ' MyTitle:' + MyTitle)
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul>
  <li><a id="123456">Mango</a>
    <img src="http://www.somesite.com/123456.png">
  </li>
  <li><a id="123457">Apple</a>
    <img src="http://www.somesite.com/123457.png">
  </li>
</ul>
&#13;
&#13;
&#13;

Fiddle here