jquery点击显示div

我有一个PHP页面，将解析一些数据，并最终获得一组数据。我想把每个键放在它自己的div中，这样用户可以点击一个单独的导航面板，并显示正确的div。jquery点击显示div

$array = array('userId'=>'bob1','firstName'=>'bob','lastName'=>'Jones');

我有一个小jQuery处理点击。

$('.nav').click(function() 
    { 
      $('.userModule').hide(); 
      var id = $(this).attr('id'); 
      $('#'+id).show(); 
});

，所以我通过interate并设置所有字段像这样：

$data = ""; 
    foreach ($array as $key => $value) 
    { 
     $data .= "<div id='" . $key . "' class='userModule'>"; 
     $data .= $key . "," . $value; 
     $data .= "</div>"; 
    $navMenu[] = $key; 
    }

和我的小导航面板：

echo "<div id='navMenu'>\n"; 
foreach ($navMenu as $v) 
{ 
    echo "<a href='#' id='" . $v . "' class='nav'>" . $v . "</a><br>\n"; 
} 
echo "</div>\n";

然后：

echo $data;

我做到这一点，因为我希望导航菜单在左侧和第四e divs在中间。我通过设置CSS导航菜单：

#navMenu{ 
    float:left; 
    clear:both; 
    } 
    .userModule{ 
    float:left; 
    }

我遇到的问题是如果我点击一个链接没有任何反应。我可以通过在foreach循环中将数据设置为$ data来解决此问题。问题是，导航菜单不会在左边的数据....

来源

2014-01-30 bart2puck

前foreach循环尝试的var_dump或为了看看你的阵列获得最后的print_r的$ navMenu？ – Alyas

navMenu数组看起来很好，因为我看到每个键的每个锚点。 – bart2puck

“navMenu”和“userModule”中的ID是否相同？ – MamaWalter

不好使用id多次。试试这个：

HTML：

<a href='#' data-id='" . $v . "' class='nav'>" . $v . "</a>

JS：

$('body').on('click', '.nav', function() { 
    $('.userModule').hide(); 
    var id = $(this).data('id'); 
    $('#'+id).show(); 
});

来源

2014-01-30 17:54:47 MamaWalter

当他在循环中使用它时，id可以更改。 –

由于数组中的键是唯一的，因此ID永远不会相同。然而，这确实使它工作... – bart2puck

一般来说，据我所见，来自PHP的代码将不会有任何影响从外部调用的脚本。因此，请尝试使用锚点中的onclick并尝试运行它。

像<a href="#" onclick="sample (this);"></a>

function sample (id) { 
// Now do whatever here. 

return false; // To prevent default action. 
}

来源

2014-01-30 17:46:52

同样的结果也在这里。 – bart2puck

尝试使用.delegate()功能的jQuery。

这将事件绑定到现在和将来的元素。

$('body').delegate('.nav', 'click', function() { 
    $('.userModule').hide(); 
    var id = $(this).attr('id'); 
    $('#'+id).show(); 
});

来源

2014-01-30 17:49:55

我试过了，没有改变。我知道事件正在发射，因为作为一个测试，我添加了警报（id），并且如预期显示的那样... – bart2puck

jquery点击显示div

回答

相关问题