Question

场景：我想在每个div.parent中更改div.child位置，以便div.child出现在＆div; div.parent .thumbnail＆＃39;之前。现在，当我添加以下代码时，每个父div将获取所有子项并将它们放在每个div中。这是我的代码：

$( ".parent" ).each(function( index, element ) {
    $( ".child").insertBefore( ".parent .thumbnail" );
});

结果应该是这样的：

 <div class="parent parent1">
    <div class="child childofParent1"></div>
    <div class="thumbnail childofParent1"></div>
</div>
<div class="parent parent2">
    <div class="child childofParent2"></div>
    <div class="thumbnail childofParent2"></div>
</div>
<div class="parent parent3">
    <div class="child childofParent3"></div>
    <div class="thumbnail childofParent3"></div>
</div>

现在，当我运行代码时，它显示为：

 <div class="parent parent1">
    <div class="child childofParent1"></div>
    <div class="child childofParent2"></div>
    <div class="child childofParent3"></div>
    <div class="thumbnail childofParent1"></div>
</div>
<div class="parent parent2">
    <div class="child childofParent1"></div>
    <div class="child childofParent2"></div>
    <div class="child childofParent3"></div>
    <div class="thumbnail childofParent2"></div>
</div>
<div class="parent parent3">
    <div class="child childofParent1"></div>
    <div class="child childofParent2"></div>
    <div class="child childofParent3"></div>
    <div class="thumbnail childofParent3"></div>
</div>

Answer 1

您应该使用[using Xamarin.Forms.Xaml; namespace XamarinTest2.views { [XamlCompilation(XamlCompilationOptions.Compile)] public partial class Search : ContentPage { public Search () { InitializeComponent(); Vid.Text = "lol"; } void SearchVideo(Object sender) { Application.Current.MainPage = new PageFeedYouTube(Vid.Text); //This line throws NullReferenceException on Vid }

将jQuery选择器的上下文限制为您的循环当前正在处理的

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XamarinTest2.views.Search"
             Title="Recherche">    
    <ContentPage.Content>
        <StackLayout>
            <Label Text="Recherche YouTube!"
                  VerticalOptions="CenterAndExpand"
                  HorizontalOptions="CenterAndExpand" />
            <Entry Placeholder="Video" Text="" IsVisible="True" IsEnabled="True" IsPassword="True" x:Name="Vid"/>
            <Button Text="Recherche" Pressed="SearchVideo" />
        </StackLayout>
    </ContentPage.Content>

.parent

$(...,this)

Answer 2

现在，有很多方法可以达到你期望的效果。其中一种方法： - 使用以下jquery： -

sms = 50000
rate = 0.1
total = 5000

sms = 50000
rate = 0.1 // when i enter 0.12
total = 5000 // still showing 5000, it should be 6000 for rate 0.12

Codepen链接： - https://codepen.io/ashish25jl/pen/RQZvdv

注意：目前趋势是朝着更轻的页面发展，并且由于随着时间的推移，vanilla javascript变得更加强大和用户友好，人们正在消除jquery。所以你可以尝试使用普通的javascript实现相同的功能。这只是我的观点。

Answer 3

你可以这样做

    $(".parent").each(function (index, element) {         
        $('<div class="child">
     </div>').insertBefore($(this).find('.thumbnail'))
    });

Answer 4

你可以试试 -

$(document).ready(function(){
    $("button").click(function(){
    $( ".parent" ).each(function( index, element ) {
    	
   var id=$( ".parent" ).find('div').hasClass('childofParent1')
        if (id == true){
    	   $( ".child1").insertBefore( ".childofParent1" );
        }
  var id1=$( ".parent" ).find('div').hasClass('childofParent2')
        if (id1 == true){
    	   $( ".child2").insertBefore( ".childofParent2" );
        }
  var id2=$( ".parent" ).find('div').hasClass('childofParent3')
        if (id1 == true){
    	   $( ".child3").insertBefore( ".childofParent3" );
        }
    });
    
  
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Insert span element before each childofParent</button>


<div class="parent parent1"> 
    <div class="thumbnail childofParent1">1</div>
</div>
<div class="parent parent2"> 
    <div class="thumbnail childofParent2">2</div>
</div>
<div class="parent parent3">
    <div class="thumbnail childofParent3">3</div>
</div>



<div class="child child1">Child1</div>
<div class="child child2">Child2</div>
<div class="child child3">Child3</div>

如何使用jquery更改每个div内的位置？

4 个答案: