小编Jor*_*len的帖子

如何防止按住移动设备上的按钮时选择附近的文本?

我有一个应用程序,用户需要按住按钮来录制音频。但是,当用户按住移动设备上的按钮时,浏览器会尝试选择附近的文本(因为用户按住手指)。这是有道理的,但我想阻止这种情况发生。

替代文本

当我添加user-select: none到文本时,它不再被选择,而是选择更高级别的文本。有没有一种方法可以完全捕获按钮级别的“用户选择事件”并防止其冒泡到附近的文本?我最终在我的 DOM 树上追逐了 user-select: none 事件,这感觉不正确。

这是我的按钮 HTML:

<Button onMouseDown={onMouseDown} onMouseUp={onFinish} onMouseLeave={onFinish} className={classes.button} onTouchStart={onMouseDown} onTouchEnd={onFinish}>
            <div className="flex items-center relative">
                <svg height={radius * 2} width={radius * 2}>
                    <circle stroke="rgba(0,0,0,0.1)" fill="transparent" strokeWidth={stroke} r={normalizedRadius} cx={radius} cy={radius} transform={`rotate(-90 ${radius} ${radius})`} />
                    <circle
                        stroke="black"
                        fill="transparent"
                        strokeWidth={stroke}
                        strokeDasharray={circumference + ' ' + circumference}
                        style={{ strokeDashoffset }}
                        r={normalizedRadius}
                        cx={radius}
                        cy={radius}
                        transform={`rotate(-90 ${radius} ${radius})`}
                    />
                </svg>
                <Mic className="absolute" style={{
                    left: '50%',
                    top: '50%',
                    transform: 'translate(-50%, -50%)',
                    fontSize: '80px'
                }}/>
            </div>
        </Button>
        <div className="flex flex-col …
Run Code Online (Sandbox Code Playgroud)

html javascript css reactjs material-ui

8
推荐指数
1
解决办法
976
查看次数

防止jQuery选择具有相同类的多个项目

我有一个帖子提要,可以点击播放按钮,播放按钮将切换到暂停按钮,但是,当我点击其中一个播放按钮时,两个暂停按钮都会打开(对于每个帖子).当页面上有多个具有相同名称的类时,如何仅允许Javascript切换Feed上的单个播放按钮.

单击顶部播放按钮后的样子(当只有顶部按钮发生变化时,两个暂停按钮都会切换):

两个暂停按钮都被切换

这是HTML:

<div class="media-circle">
<!-- the pause icon is display: none at start -->
   <i class="icon ion-ios-play"></i><i class="icon ion-pause feed-pause"></i>
</div>
Run Code Online (Sandbox Code Playgroud)

这是Javascript:

jQuery('.media-circle').click(function (e) {
    e.preventDefault();
    jQuery(this).find('i').toggleClass('ion-ios-play');
    jQuery('.feed-pause').toggle();
    //this controls universal bottom bar play button
    jQuery('#bottom-play-button-container').find('i').toggleClass('ion-ios-play').toggleClass('ion-pause'); 
});
Run Code Online (Sandbox Code Playgroud)

这是底部播放按钮的JS(非常相似)编辑*

jQuery('#bottom-play-button-container').click(function (e) {
    e.preventDefault();
    jQuery(this).find('i').toggleClass('ion-ios-play').toggleClass('ion-pause');
    jQuery('#play-pause-toggle').find('i').toggleClass('ion-ios-play').toggleClass('ion-pause');

    jQuery('.media-circle').find('i').toggleClass('ion-ios-play');
    jQuery('.feed-pause').toggle();

});
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery

6
推荐指数
1
解决办法
211
查看次数

不使用移动设备时如何禁用自定义 Angular/Ionic 页面转换

我有一个 Angular/Ionic 应用程序,它可以在本机和 Web(iPhone、Android 和 Web)上运行。我设置了一个自定义页面过渡动画,它在移动设备上看起来不错,但在像桌面这样的大屏幕上看起来很奇怪,所以我想禁用这些动画并像在普通网站上看到的那样进行传统页面加载。

我的app.module导入包含以下行,覆盖传统的滑动动画:

IonicModule.forRoot({
  navAnimation: myTransitionAnimation
}),
Run Code Online (Sandbox Code Playgroud)

我知道Platform以及如何使用它来识别应用程序当前正在运行的内容,如下所示:

this.platform.is('mobile')但这样做只能在app.component.tsnot in app.module.ts... 中使用吗?

所以基本上我的问题是如何最好地在我的app.module.ts(伪代码)中执行以下操作

IonicModule.forRoot({
    if(isMobileDevice) {
        navAnimation: myTransitionAnimation
    } else {
        animated: false //the key/value to disable transition animations
    }
}),
Run Code Online (Sandbox Code Playgroud)

ionic-framework angular

5
推荐指数
1
解决办法
3068
查看次数

如何将 Angular 组件包裹在动态组件周围

我有一个应用程序需要水平滚动许多不同类型的列表。这是一个音乐应用程序,所以我可以水平滚动专辑图像、特色图像等。我生成了一些 html,为专辑项目列表创建水平滚动,如下所示:

<div class="hs-grid">
  <div class="hs full"">
      <app-album-item *ngFor="let releaseEl of releases" [submission]="releaseEl"></app-album-item>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这会创建这样的东西: 在此输入图像描述

我的问题是,如何将网格 html 转换为组件,这样我就不必为每种不同类型的水平滚动项重复网格代码。本质上是这样的:

<app-horizontal-scroll-grid>
    <app-album-item *ngFor="let releaseEl of releases" [submission]="releaseEl"></app-album-item>
    <!-- IT CAN ALSO BE FEATURED ITEMS -->
    <app-featured-item *ngFor="let featuredItem of featured" [featuredItem]="featuredItem"></app-featured-item>
</app-horizontal-scroll-grid>
Run Code Online (Sandbox Code Playgroud)

显然这是行不通的...

我应该如何传递要在内部使用的项目列表,horizontal-grid-component因为它可以是不同类型的组件,例如:

  • app-album-item
  • app-featured-item
  • ETC?

我知道,如果我只有一种类型的组件需要水平滚动,我可以将其放置在组件 HTMLapp-album-item内部horizontal-scroll-grid并将项目列表传递到@Input(),但由于组件的类型发生了变化,我有点困惑!

感谢您的任何帮助/见解!

angular-components angular

3
推荐指数
1
解决办法
3692
查看次数

在C代码中添加到头文件时,全局数组没有'type'

我试图跨多个cpp文件使用全局变量.为此,我将变量添加到调用的头文件中,system.h并在其中创建了一个变量:

extern int test_variable[];
Run Code Online (Sandbox Code Playgroud)

现在在我file1.cppsystem.h头文件中包含标头并用值初始化变量:

int test_variable[10] = {0,2,4};
Run Code Online (Sandbox Code Playgroud)

file2.cpp我想新的号码添加到阵列中,然后打印出数组.system.h也包含在文件的顶部:

test_variable[4] = 7;

void saveToSD(){
for(int i = 0; i < 10; i++)
{
  Serial.print(test_variable[i]);
}
Run Code Online (Sandbox Code Playgroud)

但是,我收到一个错误,指出test_variablein file2.cpp中没有命名类型.我错过了什么,因为我已经在头文件中初始化了它的类型并且也file1.cpp说明了它的类型?

c++ arrays arduino

2
推荐指数
1
解决办法
168
查看次数

如何为Android Studio中的React Native App修复丢失的符号和包?

我的应用程序运行在iOS上,但是我想先进行Android测试,然后再尝试在Android Studio中进行构建,但遇到以下4个错误:

PATH/uncvrd/MainApplication.java:14: error: cannot find symbol public class MainApplication extends ExpoApplication {
                                     ^   symbol: class ExpoApplication PATH/uncvrd/MainActivity.java:11: error: package com.uncvrd.generated does not exist import com.uncvrd.generated.DetachBuildConstants;
                           ^ PATH/uncvrd/MainActivity.java:12: error: package com.uncvrd.experience does not exist import com.uncvrd.experience.DetachActivity;
                            ^ PATH/uncvrd/MainActivity.java:14: error: cannot find symbol public class MainActivity extends DetachActivity {
                                  ^   symbol: class DetachActivity 4 errors :app:compileDevDebugJavaWithJavac FAILED
Run Code Online (Sandbox Code Playgroud)

我来自CRNA,然后被驱逐到ExpoKit。这是我的MainApplication.java:

package com.uncvrd;

import com.facebook.react.ReactPackage;

import java.util.Arrays; import java.util.List;

// Needed for `react-native link` // import com.facebook.react.ReactApplication; import com.geektime.rnonesignalandroid.ReactNativeOneSignalPackage; import com.inprogress.reactnativeyoutube.ReactNativeYouTube; import com.oblador.vectoricons.VectorIconsPackage;

public …
Run Code Online (Sandbox Code Playgroud)

java android react-native

2
推荐指数
1
解决办法
1076
查看次数