Question

我有这个问题，我确信很简单，但我似乎无法弄明白。我有一个javascript函数来通过按下按钮来切换div：

的javascript：

<script type="text/javascript" charset="utf-8">
//jquery functionality for toggling member interaction containers
function toggleInteractContainers(x)
{
    if($('#'+x).is(":hidden"))
    {
        $('#'+x).slideDown(200);
    }else
    {
        $('#'+x).hide();
    }
    $('.interactContainers').hide();
}
//function for adding friends...receives two arguments
function addAsPal(a,b)
{
    //alert("Member with ID:" +a+ "is requesting to be pals with member with ID:" +b);
    var url = "request_as_pal.php";
    var thisRandNum = "<?php echo $thisRandNum; ?>";
    $("#add_pal").text("please wait...").show();
    $.post(url,{request:"requestPal", mem1:a, mem2:b, thisWipit: thisRandNum}, function(data){
    $("#add_pal").html(data).show().fadeOut(12000);
    });
}
</script>

我的HTML代码是（只是它的一部分，因为它太长了）：

<tr>
    <td height="40" class="ordinary_text_12_blue" align="center">Username:</td>
    <td class="ordinary_text_12"><?php echo $row_user_info ['username'];?></td>
    <td align="right" style="border:none;">
        <a href="#" onclick="return false"
           onmousedown="javascript:toggleInteractContainers('add_friend');">
         Add as Pal
        </a>
    </td>
</tr>
</table>
<div class="interactContainers" id="add_friend">                     
    <div align="right">
        <a class="ordinary_text_12" href="#" onclick="return false"
           onmousedown="javascript:toggleInteractContainers('add_pal');">
         Cancel&nbsp;
        </a>
    </div>
    <div>
        &nbsp; Add &nbsp;<?php echo "$firstname $lastname"; ?>&nbsp; as a Pal? &nbsp;
        <a class="ordinary_text_12" href="#" onclick="return false"
           onmousedown="javascript:addAsPal(<?php echo $user_id;?>,<?php echo $user_id2;?>);">
          Yes
        </a>
    </div>                          
</div>

如果你注意到上面的html代码的第5行，我有

onmousedown="javascript:toggleInteractContainers('add_friend');

这有效;把它改成这个：

onmousedown="javascript:toggleInteractContainers('add_pal');

它不起作用。有人可以帮我解决这个问题。感谢。

css代码是（如果需要）：

.interactContainers
{
    margin-left:10px;
    position:relative;
    width:486px;    
    display:none;
    color: #09F;
    font-weight: bold;
    text-decoration: none;
    vertical-align:middle;
    font-size: 12px;    
    background-color:#222;
    border:#FFF 1px solid;  
}

.interactionLinksDiv a
{
    background-color:#222;
    display:inline;
    border:#FFF 1px solid;
    padding:7px;
    color:#9F3;
    font-size:12px;
    text-decoration:none;
}

Answer 1

请查看此jsfiddle

我删除了onmousedown并将其放入onclick事件中。还删除了

$('.interactContainers').hide();

请告诉我这是否是您要找的。也是从你的代码中我们没有看到id ='add_pal'的div，因此没有add_pal div来隐藏或显示。

Javascript切换div的问题

1 个答案: