Question

我正在尝试制作一个滚动触发的函数，它根据滚动位置从一侧滑动元素。我想用'my-class'运行所有元素，但是目前我的代码似乎认为'this'是窗口，而不是每个'my-class'元素。我调用函数的方式有问题吗？如何让每个元素运行该函数？

这是基本的html结构：

<div class="wrapper">
    <div class="my-class"></div>
    <div class="not-my-class"></div>
    <div class="my-class"></div>
    <div class="not-my-class"></div>
    <div class="my-class"></div>
</div>

一些CSS：

.wrapper {
    width: 100%;
    height: 100%;
}
.my-class, .not-my-class {
    width: 100%;
    height: 350px;
    margin-top: 10px;
    background-color: #888888;
}

和jquery：

function fadeIn($element) {
$scrollTop = $(window).scrollTop();
$windowHeight = $(window).height();
$pageHeight = $('body').height();
$elementHeight = $($element).height();
$baseOffset = $($element).offset().top;
$length = 100;
$finalOffset = $baseOffset + ( $elementHeight / 2 );
$current = ( $scrollTop - ( $finalOffset - ($windowHeight / 2 ) - ( $length / 2 ) ) ) / $length;
if ($current > 1) {
    $current = 1;
}
else {
    if ($current < 0) {
        $current = 0;
    }
    else {}
}
$opacity = $current;
$slide = ( $current * 100 ) - 100;
$(this).css({"opacity": $opacity, "left": $slide, "position": "relative"});
}
$(window).on("load resize scroll",function(){
    $('.my-class').each(fadeIn(this));
});

Answer 1

乍一看，您应该将每次通话更改为

$('.my-class').each(function(){ fadeIn(this) });

所以它在正确的时刻运行并获得正确的范围。

Answer 2

你需要传递一个这样的函数：

public class SignupActivity extends AsyncTask<String, Void, String> {

    private Context context;

    public SignupActivity(Context context) {
        this.context = context;
    }

    protected void onPreExecute() {

    }

    @Override
    protected String doInBackground(String... arg0) {
        String fullName = arg0[0];
        String userName = arg0[1];
        String passWord = arg0[2];
        String phoneNumber = arg0[3];
        String emailAddress = arg0[4];

        String link;
        String data;
        BufferedReader bufferedReader;
        String result;

        try {
            data = "?fullname=" + URLEncoder.encode(fullName, "UTF-8");
            data += "&username=" + URLEncoder.encode(userName, "UTF-8");
            data += "&password=" + URLEncoder.encode(passWord, "UTF-8");
            data += "&phonenumber=" + URLEncoder.encode(phoneNumber, "UTF-8");
            data += "&emailaddress=" + URLEncoder.encode(emailAddress, "UTF-8");

            link = "http://testandroid.netai.net/signup.php" + data;
            URL url = new URL(link);
            HttpURLConnection con = (HttpURLConnection) url.openConnection();

            bufferedReader = new BufferedReader(new InputStreamReader(con.getInputStream()));
            result = bufferedReader.readLine();
            return result;
        } catch (Exception e) {
            return new String("Exception: " + e.getMessage());
        }
    }

    @Override
    protected void onPostExecute(String result) {
        String jsonStr = result;
        if (jsonStr != null) {
            try {
                JSONObject jsonObj = new JSONObject(jsonStr);
                String query_result = jsonObj.getString("query_result");
                if (query_result.equals("SUCCESS")) {
                    Toast.makeText(context, "Data inserted successfully. Signup successfull.", Toast.LENGTH_SHORT).show();
                } else if (query_result.equals("FAILURE")) {
                    Toast.makeText(context, "Data could not be inserted. Signup failed.", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(context, "Couldn't connect to public class SignupActivity extends AsyncTask<String, Void, String> {

    private Context context;

    public SignupActivity(Context context) {
        this.context = context;
    }

    protected void onPreExecute() {

    }

    @Override
    protected String doInBackground(String... arg0) {
        String fullName = arg0[0];
        String userName = arg0[1];
        String passWord = arg0[2];
        String phoneNumber = arg0[3];
        String emailAddress = arg0[4];

        String link;
        String data;
        BufferedReader bufferedReader;
        String result;

        try {
            data = "?fullname=" + URLEncoder.encode(fullName, "UTF-8");
            data += "&username=" + URLEncoder.encode(userName, "UTF-8");
            data += "&password=" + URLEncoder.encode(passWord, "UTF-8");
            data += "&phonenumber=" + URLEncoder.encode(phoneNumber, "UTF-8");
            data += "&emailaddress=" + URLEncoder.encode(emailAddress, "UTF-8");

            link = "http://testandroid.netai.net/signup.php" + data;
            URL url = new URL(link);
            HttpURLConnection con = (HttpURLConnection) url.openConnection();

            bufferedReader = new BufferedReader(new InputStreamReader(con.getInputStream()));
            result = bufferedReader.readLine();
            return result;
        } catch (Exception e) {
            return new String("Exception: " + e.getMessage());
        }
    }

    @Override
    protected void onPostExecute(String result) {
        String jsonStr = result;
        if (jsonStr != null) {
            try {
                JSONObject jsonObj = new JSONObject(jsonStr);
                String query_result = jsonObj.getString("query_result");
                if (query_result.equals("SUCCESS")) {
                    Toast.makeText(context, "Data inserted successfully. Signup successfull.", Toast.LENGTH_SHORT).show();
                } else if (query_result.equals("FAILURE")) {
                    Toast.makeText(context, "Data could not be inserted. Signup failed.", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(context, "Couldn't connect to remote database.", Toast.LENGTH_SHORT).show();
                }
            } catch (JSONException e) {
                e.printStackTrace();
                Toast.makeText(context, "Error parsing JSON data.", Toast.LENGTH_SHORT).show();
            }
        } else {
            Toast.makeText(context, "Couldn't get any JSON data.", Toast.LENGTH_SHORT).show();
        }
    }
}

因此$('.my-class').each(function(){ fadeIn(this) });指的是.my-class元素而不是窗口

如何在每次窗口滚动时调用具有特定类的每个元素的函数（jquery））

2 个答案: