满足两个条件值后插入内容

我真的不知道如何解决这个问题。我一直在阅读像javascript，html，css等10小时，如果语句，条件等等（初学者试图学习所有东西> _ <）。这很有趣，但我很困扰如何解决这个问题。满足两个条件值后插入内容

这是我正在努力完成的。我希望用户能够点击2张图片中的1张，然后将图片的值从0更改为1或选择？然后我想再做一次这个确切的场景（基本上是两种不同的输入选择）。最后，我想通过div在页面上插入其他内容，如果两个值都从0更改为1.

对于我的问题，我也非常抱歉没有受过教育。尽管我尽力学习，但我绝对喜欢试验和错误。

编辑：这是我在这个网站上的第一篇文章。你们是令人难以置信的。给我一些时间阅读所有评论。我必须查看你们所提到的很多东西来充分理解它。

不管再次感谢。

2012-01-09 user1137804

我不知道我很明白你正在试图完成什么...但你应该能够用Javascript使用onclick事件来完成它。您可以调用一个名为“selectImage”的函数，并在那里更改变量的值（以了解哪个图像被点击），并且还可以更改单击图像的CSS以添加可视边框。我建议你使用jQuery来完成它，与使用纯Javascript相比，它的工作量更少，工作更可靠。 – Pier 2012-01-09 01:12:42

HTML

<img src="" id="Picture1"> 
<img src="" id="Picture2">

脚本

//Apply a click event to both pictures and have it callback to the checkClick function 
$("#Picture1, #Picture2").click(checkClick); 

function checkClick(e) 
{ 
    //$(this) will refer to the currently clicked picture, 
    //jQuery's .data function allows storing data within the object 
    $(this).data("clicked",1); 

    //Grab the data values from both pictures 
    var p1 = $("#Picture1").data("clicked"); 
    var p2 = $("#Picture2").data("clicked"); 

    //Check if both equal 1 (will once each has been clicked) 
    if(p1 == 1 && p2 == 1) 
     ShowContent(); 
} 

function ShowContent() 
{ 
    //do your code to show content 
}

来源

2012-01-09 01:21:53

我真的很享受你在这里做了什么，它对我正在尝试做的事情非常有效。 Patrick的帮助非常感谢。我会玩弄一下，看看我是否可以偶然发现任何其他问题 – user1137804 2012-01-09 01:45:07

是否有可能通过其他操作清除点击数据？比如说用户点击了一张图片。然后在完成上面的序列之前点击第3张图片。这个附加事件是否可以清除以前的数据？ – user1137804 2012-01-09 01:48:45

$（“＃Picture1，＃Picture2”）。数据（ “点击”，0）;要清除数据，只需设置第三张图片的点击事件来执行该行，它将清除两者。 – 2012-01-09 01:54:32

你想要什么的要点是：

var pic1 = false 
    , pic2 = false; 

$('.pic1').bind('click', function(){ 
    pic1 = true; 
    check(); 
}); 

$('.pic2').bind('click', function(){ 
    pic2 = true; 
    check(); 
}); 

function check(){ 
    if(pic1 && pic2){ // do something here } 
}

来源

2012-01-09 01:16:45

怎么是这样的：

var selected[0] = false; 
var selected[1] = false; 
function imageClicked(tag) { 
    selected[tag] = !selected[tag]; 
    self.selectedTagValueChanged(); 
}; 

function selectedTagValueChanged() { 
    if (selected[0] && selected[1] { 
     //Inserrt your DOM manipulation stuff here 
    } 
}

此代码将昌每次变量的值的imageClicked函数被调用与单击之前的值相反（如切换）。

来源

2012-01-09 01:19:20 dbrajkovic

将任意数据添加到任意HTML元素的一种方法是使用数据属性。解决您的问题的一种方法是将用户点击它时设置为data-clicked，然后检查组合条件。示例（使用jQuery）：

<img class="clickable-image" src="..." data-clicked="0"/> 
<img class="clickable-image" src="..." data-clicked="0"/> 
<script type="text/javascript> 
    $(".clickable-image").click(function() { 
     $(this).data("clicked") = 1; 
     var allOnes = true; 
     $(".clickable-image").each(function() { 
      allOnes = allOnes && $(this).data("clicked") == 1; 
     }); 
     if (allOnes) { 
      // Your custom code 
     } 
    }); 
</script>

来源

2012-01-09 01:19:38 mgibsonbr

jQuery的数据函数并没有设置data- *属性，所以你不必在html标记 – 2012-01-09 01:30:19

@PatrickEvans中包含这些属性，但它会读取它，所以会有一个初始值（即使在这个特殊情况下，它不是真的需要）。 http://api.jquery.com/data/#data-html5 – mgibsonbr 2012-01-09 01:39:52

满足两个条件值后插入内容

回答

相关问题