Question

所以...我想要的是以下内容：

当我点击一个带有以'menu'开头的id的元素时，它会将其attr value ='value'变为变量并在下一个函数中使用它。

这是来源：

的index.html

<div id='menuBar' >
  <img id='menu01' src='/si/img/menu.apresentacao.jpg' value='apresentacao' >
  <img id='menu02' src='/si/img/menu.servicos.jpg' value='servicos' >
</div>

的jquery.js

$(document).ready(function() {

 $('img[id^='menu']').click( function(){

  var menuValue = $(this).attr('value');

  $('div#contentBox').fadeOut(300, function() {
   $('div#contentBox').replaceWith('<div id="contentBox">' + menuValue + '</div>');
  });
 });

});

variables.js

var servicos = "<p id='title'>Serviços</p><br><p id='text'>text text</p><br>";

提前致谢*

Answer 1

您的代码唯一的问题是您的选择器格式不正确，因此不起作用：

$('img[id^='menu']').click( function(){
  ^        ^    ^ ^
  |        |    | |
  |        |    | \__ Closing single quote
  |        |    |
  |        |    \__ Opening single quote
  |        |
  |        |
  |        \__ Closing single quote
  |
  \__ Opening single quote


  ====> does not compute!

应该是什么，这是（请注意“menu：”附近的双引号：

$('img[id^="menu"]').click( function(){
           ^    ^
           |    |
           \    /
            \  /
             \/
              \_Double quotes, yay!

......它运作得很好：http://jsfiddle.net/HnsTu/

Answer 2

而不是使用var servicos而是使用具有图像值的对象作为关键字。

var menuValueContent = {'servicos': '<p>....</p>', 'apre': '...'};

并在您的点击处理程序中，您可以使用menuValueContent[menuValue]来获取新内容。

获取此元素属性并将其用于其他元素

2 个答案: